Skip to content
Snippets Groups Projects
Commit b79f5405 authored by HauErn Lien's avatar HauErn Lien
Browse files

Update file tryhomepage.html

parent 54cd0c25
No related branches found
No related tags found
No related merge requests found
...@@ -3,229 +3,16 @@ ...@@ -3,229 +3,16 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tsinghua - IGEM 2024</title> <title>Sachet Animation</title>
<link rel="icon" type="image/x-icon" href="https://static.igem.wiki/teams/5187/art/icon.png"> <link rel="stylesheet" href="style.css">
<style>
.team-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 10px;
max-width: 1200px;
margin: 0 auto;
justify-content: center;
}
.team-member {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.image-container, .image-placeholder {
width: 280px;
height: 280px;
overflow: hidden;
margin-bottom: 5px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 20px;
}
.image-container img {
width: 100%;
height: 100%;
object-fit: cover;
}
.image-placeholder {
background-color: #000;
}
.text-area {
width: 280px;
height: 40px;
background-color: #fa8072;
color: white;
display: flex;
justify-content: center;
align-items: center;
border-radius: 20px;
}
.text-area .name {
font-size: 18px;
font-weight: bold;
}
@media (max-width: 940px) {
.team-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 620px) {
.team-grid {
grid-template-columns: 1fr;
}
}
</style>
</head> </head>
<body> <body>
{% extends "layout.html" %} <div class="sachet">
<img src="tied-sachet.svg" alt="Tied Sachet" class="bag tied">
{% block title %} <div class="scent"></div>
Meet Our Team Members
{% endblock %}
{% block page_content %}
<div style="text-align: center;">
<img src="https://static.igem.wiki/teams/5187/teammembers/team-pic.jpg" alt="thu" style="max-width: 100%; height: auto; width: 60%;border-radius: 20px;margin-bottom: 50px;">
</div>
<div class="team-grid">
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/chr.jpg" alt="chr">
</div>
<div class="text-area">
<div class="name">HaoRan Chang</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/cjh.jpg" alt="cjh">
</div>
<div class="text-area">
<div class="name">JiaHui Chen</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/lzf.jpg" alt="lzf">
</div>
<div class="text-area">
<div class="name">ZheFu Li</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/xwh.jpg" alt="xwh">
</div>
<div class="text-area">
<div class="name">WeiHan Xiao</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/wym.jpg" alt="wym">
</div>
<div class="text-area">
<div class="name">YiMing Wang</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/syh.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">YuHang Shen</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/lhe.jpg" alt="lhe">
</div>
<div class="text-area">
<div class="name">GaoEn Lian</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/cht.png" alt="cht">
</div>
<div class="text-area">
<div class="name">HouTeng Chan</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/xyh.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">YuHan Xie</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/lss.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">ShiSu Li</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/wwb.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">WanPeng Wu</div>
</div>
</div> </div>
<div class="team-member"> <script src="script.js"></script>
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/xialin-xl.jpg" alt="xl">
</div>
<div class="text-area">
<div class="name">Chalen Wakim</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/jzy.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">ZhouYuan Ji</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/fcq.jpg" alt="fcq">
</div>
<div class="text-area">
<div class="name">ChangQi Fan</div>
</div>
</div>
<div class="team-member">
<div class="image-container">
<img src="https://static.igem.wiki/teams/5187/teammembers/lzy.jpg" alt="lzy">
</div>
<div class="text-area">
<div class="name">ZiYue Li</div>
</div>
</div>
</div>
{% endblock %}
</body> </body>
</html> </html>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment