Member page (#14)

* initial working prototype

* rework member page

* header refinement

* add more photos

* refine code

* make prettier happy

* adjust vertical space

.vscode/settings.json

@@ -0,0 +1,33 @@
+{
+  "cSpell.words": [
+    "chenchen",
+    "chenyu",
+    "Dongjie",
+    "endfor",
+    "Guokun",
+    "Haier",
+    "Hanzhong",
+    "jiangyongpeng",
+    "jiayongyi",
+    "Kangchen",
+    "lvkangchen",
+    "Mingrui",
+    "nieyixiao",
+    "shuyana",
+    "wuguokun",
+    "Xiangjie",
+    "Xuan",
+    "Yana",
+    "yanbo",
+    "yanxiangjie",
+    "Yixiao",
+    "Yongpeng",
+    "Yongyi",
+    "yumingrui",
+    "Zhang",
+    "Zhong",
+    "zhonghanzhong",
+    "zhudongjie",
+    "zhuhaier"
+  ]
+}

_config.yml

@@ -4,6 +4,7 @@
 
 title: blank # the website title (if blank, full name will be used instead)
 first_name: Intelligent Robotic Manipulation
+abbr_name: IRM # added by cc
 middle_name:
 last_name: Lab
 email:
@@ -184,6 +185,9 @@ collections:
   projects:
     output: true
     permalink: /projects/:path/
+  people:
+    output: true
+    permalink: /people/:path/
 
 announcements:
   enabled: true

_data/members.yml

@@ -0,0 +1,56 @@
+- name: PhD Students
+  full: true
+  list:
+    - name: Mingrui Yu / 于铭瑞
+      image: assets/img/people/yumingrui.jpg
+      website: https://mingrui-yu.github.io
+      alt: I am Mingrui. I am wearing a gray polo shirt.
+    - name: Xiangjie Yan / 严相杰
+      image: assets/img/people/yanxiangjie.jpg
+      website: https://yanseim.github.io
+      alt: I am Xiangjie. I am wearing a black shirt.
+    - name: Yongyi Jia / 贾永奕
+      image: assets/img/people/jiayongyi.jpg
+      alt: I am Yongyi. I am wearing a white shirt.
+    - name: Kangchen Lv / 吕康晨
+      image: assets/img/people/lvkangchen.jpg
+      alt: I am Kangchen. I am wearing a suit.
+    - name: Yu Chen / 陈煜
+      image: assets/img/people/chenyu.jpg
+      alt: I am Yu. I am wearing a green shirt.
+    - name: Hanzhong Zhong / 钟瀚中
+      image: assets/img/people/zhonghanzhong.jpg
+      alt: I am Hanzhong. I am wearing a blue jacket.
+    - name: Yongpeng Jiang / 姜永鹏
+      image: assets/img/people/jiangyongpeng.jpg
+      website: https://director-of-g.github.io
+      alt: I am Yongpeng. I am wearing a blue shirt.
+    - name: Dongjie Zhu / 朱东杰
+      image: assets/img/people/zhudongjie.jpg
+      alt: I am Dongjie. I am wearing a suit.
+- name: Master's Students
+  full: true
+  list:
+    - name: Yixiao Nie / 聂亦潇
+      image: assets/img/people/nieyixiao.jpg
+      alt: I am Yixiao. I am wearing a black shirt.
+    - name: Haier Zhu / 朱海尔
+      image: assets/img/people/zhuhaier.jpg
+      alt: I am Haier. I am wearing a gray shirt.
+    - name: Bo Yan / 晏博
+      image: assets/img/people/yanbo.jpg
+      alt: I am Bo. I am wearing a blue jacket.
+- name: Undergraduate Students
+  full: true
+  list:
+    - name: Chen Chen / 陈辰
+      website: https://calaw.cc/
+      image: assets/img/people/chenchen.jpg
+      alt: I am Chen. I am wearing a white shirt.
+- name: Alumni
+  full: false
+  list:
+    - name: Hao Liu
+    - name: Xuan Zhang
+    - name: Guokun Wu / 吴国昆
+    - name: Yana Shu / 舒雅娜

_includes/header.liquid

@@ -5,10 +5,11 @@
       {% if page.permalink != '/' %}
         <a class="navbar-brand title font-weight-lighter" href="{{ site.baseurl }}/">
           {% if site.title == 'blank' %}
-            {% if site.first_name %}
+            {% if site.abbr_name %}
               <span class="font-weight-bold">
-                {{- site.first_name -}}
+                {{- site.abbr_name -}}
               </span>
+              {% comment %} changed by cc {% endcomment %}
             {% endif %}
             {% if site.middle_name %}
               {{- site.middle_name -}}

_layouts/profiles.liquid

@@ -31,6 +31,7 @@ layout: page
           {% endif %}
         </div>
       {% endfor %}
+      {{ content }}
     {% endif %}
   </article>
 </div>

_pages/about_xiangli.md

@@ -0,0 +1,5 @@
+## **Li, Xiang / 李翔**
+
+Xiang LI received the Bachelor and Master degrees from Beijing Institute of Technology in 2006 and 2008, and the PhD degree from Nanyang Technological University in 2013 respectively. From Aug. 2012 to Feb. 2015, he was a Research Fellow at the Intelligent Robotics Lab, Nanyang Technological University, Singapore. From Feb. 2015 to Aug. 2016, he was a Research Fellow at the Department of Biomedical Engineering, National University of Singapore. From Aug. 2016 to Aug. 2019, he was a Research Assistant Professor at the Department of Mechanical and Automation Engineering, The Chinese University of Hong Kong. He is now working as an Associate Professor at the Department of Automation, Tsinghua University.
+
+Xiang LI was the Associate Editor of IEEE Robotics & Automation Magazine from 2019 to 2021 and the Associate Editor of IEEE International Conference on Robotics and Automation (ICRA) from 2019 to 2021. He has been the Associate Editor of IEEE Robotics and Automation Letters since 2022, and the Associate Editor of IEEE Transactions on Automation Science and Engineering since 2023. He received the Highly Commended Paper Award in 2013 IFToMM International Symposium on Robotics and Mechatronics, the Best Paper in Robotic Control in 2017 International Conference on Advanced Robotics, the Best Application Paper Finalists in 2017 IEEE/RSJ International Conference on Intelligent Robots and Systems (IROS), and the T. J. Tarn Best Paper in Robotics in IEEE International Conference on Robotics and Biomimetics. He is the Program Chair of the 2023 IEEE International Conference on Real-time Computing and Robotics. His current research interests include deformable object manipulation, physical human-robot interaction, robot-assisted optical tweezers, and multi-agent system.

_pages/members.md

@@ -0,0 +1,55 @@
+---
+layout: profiles
+permalink: /members/
+title: Members
+nav: true
+nav_order: 7
+display_categories: [PhD Students, Master's Students, Undergraduate Students, Alumni]
+horizontal: true
+profiles:
+  # if you want to include more than one profile, just replicate the following block
+  # and create one content file for each profile inside _pages/
+  - align: right
+    image: people/lixiang.jpg
+    content: about_xiangli.md
+    image_circular: false # crops the image to make it circular
+---
+
+---
+
+<div class="row">
+  {% for group in site.data.members %}
+    {% if group.list.size > 0 %}
+      {% if group.name %}
+        <div class="w-100"></div>
+          <h2>{{ group.name }}</h2>
+        <div class="w-100"></div>
+      {% endif %}
+      {% if group.full %}
+        <div style="margin-bottom:0.5rem"></div>
+        <div class="row">
+          {% for member in group.list %}
+            <div class="col-xl-3 col-lg-3 col-md-4 text-center col-sm-6 col-xs-6">
+              <a target="_blank" href="{{member.website}}">
+                {% include figure.liquid loading="eager" path=member.image alt=member.alt class="img-fluid rounded" %} 
+              </a>
+              <p style="margin-bottom:1.5rem">{{ member.name }}</p>
+              <!-- the figure has 1rem vertical margin -->
+            </div>
+          {% endfor %}
+        </div>
+      {% else %}
+        <ul>
+        {% for member in group.list %}
+          {% if member.website %}
+            <li><a target="_blank" href="{{member.website}}">{{ member.name }}</a></li>
+          {% else %}
+            <li>{{ member.name }}</li>
+          {% endif %} 
+        {% endfor %}
+        </ul>
+      {% endif %}
+      <br>
+    {% endif %}
+  {% endfor %}
+</div>