Debug people's photos; add social links at footer

Author: GZHoffie

_authors/atsadawut-surinrangsee.md

@@ -0,0 +1,8 @@
+---
+username: atsadawut-surinrangsee
+name: Atsadawut Surinrangsee
+position: Intern
+is_intern: true
+image: '/images/members/atsadawut-surinrangsee.jpg'
+linkedin: https://www.linkedin.com/in/atsadawut-surinrangsee-918579309/?originalSubdomain=th
+---

_data/settings.yml

@@ -1,6 +1,6 @@
 #-------------------------------
 # Site Settings
-title: MTMS
+title: MTMS Lab
 logo: /images/misc/MTMSlogo.png # You can add own logo. For example "/images/logo.png".
 logo_dark: /images/misc/MTMSlogo_dark.png
 logo_footer: /images/misc/ASTAR_NUS_logo.png
@@ -90,8 +90,10 @@ footer__menu__settings:
 
 # Social Links
 social:
-- {icon: "ion-logo-twitter", color: "#55acee", name: Twitter, link: "https://x.com/NiranjanTW"}
-- {icon: "ion-logo-github", color: "#000000", name: GitHub, link: "https://github.com/CSB5"}
+- {color: "#000000", name: X, link: "https://x.com/NiranjanTW", icon_image: https://cdn.simpleicons.org/x/white}
+- {color: "#1185FE", name: Bluesky, link: "https://bsky.app/profile/niranjantw.bsky.social", icon_image: https://cdn.simpleicons.org/bluesky/white}
+- {color: "#181717", name: GitHub, link: "https://github.com/CSB5", icon_image: https://cdn.simpleicons.org/github/white}
+
 
 
 

_includes/footer.html

@@ -34,7 +34,9 @@ <h3 class="widget-footer__title">Follow</h3>
               <ul class="social__list list-reset">
                 {% for social in site.data.settings.social %}
                 <li class="social__item">
-                  <i class="ion {{social.icon}}" style="background-color: {{social.color}};"></i>
+                  <a class="social__logo" style="background-color: {{social.color}};" href="{{social.link}}" target="_blank">
+                    <img height="15" width="15" src={{social.icon_image}} />
+                  </a>
                   <a class="social__link" href="{{social.link}}" target="_blank" rel="noopener" aria-label="{{social.label}} link">{{social.name | capitalize}}</a>
                 </li>
                 {% endfor %}

_layouts/author.html

@@ -86,7 +86,7 @@ <h2>{{ page.position }}</h2>
       </div>
       {% elsif page.image %}
       <div class="col col-5 push-1 col-d-12 push-d-0">
-        <div class="post-image">
+        <div class="author-image">
           <img class="lazy" data-src="{{site.baseurl}}{{page.image}}" alt="{{page.title}}">
         </div>
         {% if page.image_caption %}

_pages/publications.html

@@ -17,7 +17,7 @@ <h1 class="tag__title">{{ page.title }}</h1>
       <div class="section__info">
         <div class="section__head__small">
           <h1 class="section__title">{{ year.year }}</h1>
-          <a class="section__link top__link" href="#top">Return to top</a>
+          <!-- <a class="section__link top__link" href="#top">Return to top</a> -->
         </div>
       </div>
     </div>

_sass/3-modules/_footer.scss

@@ -113,6 +113,26 @@
         border-radius: 50%;
         margin-right: 8px;
       }
+
+      .social__logo {
+        width: 25px;
+        height: 25px;
+        text-align: center;
+        margin-right: 12px;
+        font-size: 20px;
+        line-height: 1;
+        border-radius: 30px;
+        color: var(--link-color);
+
+        &:last-child {
+          margin-right: 0;
+        }
+
+        &:hover {
+          background-color: var(--darken-gray);
+        }
+
+      }
     }
 
     .social__link {

_sass/3-modules/_hero.scss

@@ -19,7 +19,7 @@
   }
 
   @media (max-width: $mobile) {
-    height: 850px;
+    height: 840px;
   }
 }