Skip to content

Commit 1c7f99c

Browse files
juchengbjuchengb
committed
feat: 加入 Yvonne 個人身份
1 parent 6f618f7 commit 1c7f99c

File tree

2 files changed

+118
-0
lines changed

2 files changed

+118
-0
lines changed

‎students/2025-11-03-2025-10-03-chengfengju/index.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<html lang="zh-TW">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>My Namecard</title>
7+
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;500;700&display=swap" rel="stylesheet">
8+
<link rel="stylesheet" href="./style.css">
9+
</head>
10+
11+
<body>
12+
<div class="namecard">
13+
<h2>Yvonne Cheng</h2>
14+
<h5>Software Engineer</h5>
15+
<hr>
16+
<p>From code to automation.</p>
17+
18+
<div class="triangle triangle1"></div>
19+
<div class="triangle triangle2"></div>
20+
<div class="triangle triangle3"></div>
21+
</div>
22+
</body>
23+
</html>

‎students/2025-11-03-2025-10-03-chengfengju/style.css‎

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
* {
2+
font-family: 'JetBrains Mono', monospace;
3+
box-sizing: border-box;
4+
}
5+
6+
html,
7+
body {
8+
width: 100%;
9+
height: 100%;
10+
margin: 0;
11+
padding: 0;
12+
display: flex;
13+
justify-content: center;
14+
align-items: center;
15+
}
16+
17+
body {
18+
background-color: #1c1c1c;
19+
overflow: hidden;
20+
}
21+
22+
.namecard {
23+
width: 380px;
24+
height: 220px;
25+
display: flex;
26+
flex-direction: column;
27+
justify-content: flex-end;
28+
padding: 2rem;
29+
background-color: #080808;
30+
letter-spacing: 0.08rem;
31+
color: #ffffff;
32+
overflow: hidden;
33+
border-radius: .8rem;
34+
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.7);
35+
position: relative;
36+
}
37+
38+
.namecard h2 {
39+
font-weight: 700;
40+
margin-bottom: 5px;
41+
color: #FFD700;
42+
line-height: 1.2;
43+
}
44+
45+
.namecard h5 {
46+
color: #aaaaaa;
47+
font-weight: 500;
48+
margin-top: 0;
49+
margin-bottom: 10px;
50+
}
51+
52+
.namecard p {
53+
line-height: 1.5;
54+
color: #888888;
55+
margin-top: 5px;
56+
font-size: 13px;
57+
}
58+
59+
.namecard hr {
60+
border: none;
61+
border-top: 1px solid rgba(255, 255, 255, 0.15);
62+
margin: 10px 0;
63+
}
64+
65+
.triangle {
66+
width: 0;
67+
height: 0;
68+
position: absolute;
69+
border-radius: .6rem;
70+
}
71+
72+
.triangle1 {
73+
right: 30px;
74+
bottom: 30px;
75+
border-top: solid 40px #FFD700;
76+
border-right: solid 40px transparent;
77+
transform: rotate(-135deg);
78+
opacity: 0.8;
79+
}
80+
81+
.triangle2 {
82+
right: -100px;
83+
top: -50px;
84+
border-top: solid 180px rgba(255, 255, 255, 0.1);
85+
border-right: solid 180px transparent;
86+
transform: rotate(-45deg);
87+
}
88+
89+
.triangle3 {
90+
right: 0px;
91+
bottom: 0px;
92+
border-top: solid 60px rgba(255, 255, 255, 0.08);
93+
border-right: solid 60px transparent;
94+
transform: rotate(-45deg);
95+
}

0 commit comments

Comments
 (0)