Error in user YAML: Alias parsing is not enabled.
---
layout: article
titles:
en : &EN Member
en-GB : *EN
en-US : *EN
en-CA : *EN
en-AU : *EN
zh-Hans : &ZH_HANS 成员
zh : *ZH_HANS
zh-CN : *ZH_HANS
zh-SG : *ZH_HANS
zh-Hant : &ZH_HANT 關於
zh-TW : *ZH_HANT
zh-HK : *ZH_HANT
ko : &KO 소개
ko-KR : *KO
fr : &FR À propos
fr-BE : *FR
fr-CA : *FR
fr-CH : *FR
fr-FR : *FR
fr-LU : *FR
key: page-about
---
<style>
.scroll-container {
width: 100%;
overflow: hidden;
white-space: nowrap;
margin-bottom: 10px;
position: relative;
}
.scroll-content {
display: flex;
width: max-content;
animation: scroll-left 20s linear infinite;
}
.scroll-content.alternate {
position: relative;
left: -55pt;
animation: scroll-left 20s linear infinite;
}
.scroll-content a {
display: inline-block;
margin: 10px;
}
.scroll-content img {
width: 100pt;
height: 100pt;
border-radius: 50%;
}
@keyframes scroll-left {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-50%);
}
}
.container {
display: grid;
background-color: #f4f4f4;
border-radius: 10px;
grid-template-rows: auto;
gap: 20px;
padding: 10px;
font-family: Arial, sans-serif;
}
.member-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
background-color: #f4f4f4;
border-radius: 10px;
padding: 10px;
}
@media (max-width: 1200px) {
.member-list {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 800px) {
.member-list {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 500px) {
.member-list {
grid-template-columns: repeat(1, 1fr);
}
}
.member {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
background-color: white;
border-radius: 10px;
padding: 15px;
}
.member .avatar {
display: flex;
justify-content: center;
align-items: center;
}
.member img {
width: 60px;
height: 60px;
border-radius: 50%;
transition: transform 0.3s, filter 0.3s;
}
.member img:hover {
transform: scale(1.1);
}
.member .info {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.member .name {
font-size: 16px;
font-weight: bold;
}
.member .description {
font-size: 14px;
color: #666;
}
</style>