Scribd
Upload
6 views16 pages

Code Web

The document outlines the structure and content of a website for the K8 Tam Son basketball team at Hanoi-Amsterdam High School. It includes sections on the team's schedule, vision, roster, and highlights, along with styling details for a visually appealing layout. The site aims to promote team spirit, athleticism, and community among students.

Uploaded by

Nam Khánh Lê
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
6 views16 pages

Code Web

The document outlines the structure and content of a website for the K8 Tam Son basketball team at Hanoi-Amsterdam High School. It includes sections on the team's schedule, vision, roster, and highlights, along with styling details for a visually appealing layout. The site aims to promote team spirit, athleticism, and community among students.

Uploaded by

Nam Khánh Lê
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>K8 Tam Son - 12 Physics 1 Basketball Team</title>
<style>
:root {
--primary-color: #ff0000;
--primary-hover: #cc0000;
--secondary-color: #000000;
--light-color: #f4f4f4;
--text-color: #333;
--font-main: 'Segoe UI', Tahoma, Geneva, Verdana, sans-
serif;
--card-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: var(--font-main);
color: var(--text-color);
background-color: var(--light-color);
line-height: 1.6;
display: flex;
flex-direction: column;
min-height: 100vh;
}
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

header {
background-color: var(--secondary-color);
color: #fff;
padding: 1rem 0;
position: sticky;
top: 0;
z-index: 1000;
border-bottom: 3px solid var(--primary-color);
box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
header .container {
max-width: 1200px;
margin: auto;
padding: 0 20px;
display: flex;
flex-direction: column;
align-items: center;
gap: 15px;
}
.logo { font-size: 1.8rem; font-weight: bold; text-transform:
uppercase; letter-spacing: 1px; }
.logo span { color: var(--primary-color); }

nav ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
nav a {
font-weight: 600;
font-size: 0.95rem;
padding: 8px 15px;
border-radius: 20px;
transition: all 0.3s ease;
color: #ccc;
cursor: pointer;
}
nav a:hover { color: #fff; background: rgba(255,255,255,0.1); }

nav [Link] {
background-color: var(--primary-color);
color: #fff;
box-shadow: 0 0 10px rgba(255, 0, 0, 0.5);
}

.page-section {
display: none;
padding: 40px 20px;
animation: fadeIn 0.5s ease-in-out;
flex: 1;
}
.[Link] {
display: block;
}

@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}

.container { max-width: 1100px; margin: auto; }


.section-title {
text-align: center;
font-size: 2.2rem;
margin-bottom: 30px;
color: var(--secondary-color);
text-transform: uppercase;
border-bottom: 2px solid var(--primary-color);
display: inline-block;
padding-bottom: 5px;
position: relative;
left: 50%;
transform: translateX(-50%);
}

#home {
padding: 0;
height: calc(100vh - 140px);
background: linear-gradient(rgba(0,0,0, 0.6), rgba(0,0,0,
0.6)), url('[Link]
9/370100083_323696280249656_7197612262999410283_n.jpg?
_nc_cat=108&ccb=1-
7&_nc_sid=9f807c&_nc_ohc=LcMUrpP4dnYQ7kNvwGekoJ2&_nc_oc=AdmKz7VU_ILaMo_
Iz-Ibr259-
Owb0kUH1a8e67S2wUk62c1ZziBoOh0y2eT9vt0yn3ZRDtrXL1SOSP0yVcoqbIGl&_nc_zt=
23&_nc_ht=[Link]&oh=03_Q7cD4AHGu3Vkl4L73VKQsJ4m-
O2RYsJ27I0ZpI6cibT-_kBFFw&oe=695CE933') no-repeat center center/cover;
display: flex !important;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
color: #fff;
}
#home h1 { font-size: 3.5rem; margin-bottom: 10px; text-
transform: uppercase; letter-spacing: 2px; text-shadow: 2px 2px 4px
#000; }
#home p { font-size: 1.4rem; margin-bottom: 25px; text-shadow:
1px 1px 2px #000; }
.btn {
display: inline-block;
background: var(--primary-color);
color: #fff;
padding: 12px 35px;
border: none;
border-radius: 5px;
font-size: 1.1rem;
cursor: pointer;
transition: background 0.3s;
}
.btn:hover { background: var(--primary-hover); }

table { width: 100%; border-collapse: collapse; background:


#fff; box-shadow: var(--card-shadow); border-radius: 8px; overflow:
hidden; }
th, td { padding: 15px; text-align: center; border-bottom: 1px
solid #ddd; }
th { background-color: var(--secondary-color); color: #fff; }
.win { color: #28a745; font-weight: bold; }
.loss { color: #dc3545; font-weight: bold; }
.goals-grid { display: grid; grid-template-columns:
repeat(auto-fit, minmax(250px, 1fr)); gap: 30px; }
.goal-card { background: #fff; padding: 30px; border-radius:
8px; text-align: center; box-shadow: var(--card-shadow); transition:
transform 0.3s; }
.goal-card:hover { transform: translateY(-5px); border-bottom:
4px solid var(--primary-color); }
.goal-icon { font-size: 3rem; display: block; margin-bottom:
10px; }

.roster-grid { display: grid; grid-template-columns:


repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; }
.player-card {
background: #fff;
border-radius: 10px;
overflow: hidden;
box-shadow: var(--card-shadow);
transition: transform 0.3s ease;
display: flex;
flex-direction: column;
}
.player-card:hover { transform: scale(1.02); }
.player-img {
background-color: #ccc;
height: 350px;
width: 100%;
object-fit: cover;
object-position: top;
}
.player-info { padding: 20px; text-align: center; flex: 1; }
.player-number { font-size: 1.2rem; color: var(--primary-
color); font-weight: bold; }
.player-name { font-size: 1.3rem; font-weight: bold; margin:
5px 0; }
.player-pos { color: #666; font-style: italic; margin-bottom:
15px; }

.stats-table {
width: 100%;
font-size: 0.85rem;
border-collapse: collapse;
margin-top: 10px;
}
.stats-table th { background: #333; color: #fff; padding: 5px;
font-size: 0.7rem; }
.stats-table td { border: 1px solid #eee; padding: 5px; font-
weight: 600; }
.stats-table tr:nth-child(even) { background-color: #f9f9f9; }

.highlights-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px,
1fr));
gap: 20px;
}
.video-card {
background: #000;
border-radius: 8px;
overflow: hidden;
box-shadow: var(--card-shadow);
}
.video-wrapper {
position: relative;
padding-bottom: 56.25%;
height: 0;
}
.video-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-title {
color: #fff;
padding: 10px;
text-align: center;
font-weight: bold;
}

.merch-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px,
1fr));
gap: 30px;
}
.merch-item {
background: #fff;
border-radius: 8px;
padding: 20px;
text-align: center;
box-shadow: var(--card-shadow);
border: 1px solid #eee;
transition: 0.3s;
}
.merch-item:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.15); }
.merch-img {
width: 100%;
height: 200px;
object-fit: contain;
margin-bottom: 15px;
}
.merch-price { color: var(--primary-color); font-size: 1.2rem;
font-weight: bold; display: block; margin: 10px 0; }
.btn-buy {
background: var(--secondary-color);
color: #fff;
padding: 8px 20px;
border-radius: 4px;
font-size: 0.9rem;
border: none;
cursor: pointer;
}
.btn-buy:hover { background: #333; }

.form-container { max-width: 500px; background: #fff; padding:


30px; border-radius: 8px; box-shadow: var(--card-shadow); }
.form-group { margin-bottom: 15px; }
.form-group label { display: block; margin-bottom: 5px; font-
weight: 600; }
.form-group input, .form-group select, .form-group textarea {
width: 100%; padding: 10px; border: 1px solid #ccc; border-
radius: 4px;
}
.sponsors-grid { display: flex; justify-content: center; gap:
40px; margin-top: 20px; flex-wrap: wrap;}
.sponsor-img { height: 80px; width: auto; opacity: 0.8;
transition: 0.3s; }
.sponsor-img:hover { opacity: 1; transform: scale(1.05); }

footer {
background: var(--secondary-color);
color: #777;
text-align: center;
padding: 20px;
margin-top: auto;
font-size: 0.9rem;
}

@media(max-width: 768px) {
#home h1 { font-size: 2.5rem; }
nav a { padding: 5px 10px; font-size: 0.8rem; }
.player-img { height: 300px; }
}
</style>
</head>
<body>

<header>
<div class="container">
<div class="logo">K8 <span>Tam Son</span></div>
<nav>
<ul>
<li><a class="nav-link active"
onclick="showPage('home')">Home</a></li>
<li><a class="nav-link"
onclick="showPage('schedule')">Schedule</a></li>
<li><a class="nav-link"
onclick="showPage('vision')">Vision</a></li>
<li><a class="nav-link"
onclick="showPage('roster')">Roster</a></li>
<li><a class="nav-link"
onclick="showPage('highlights')">Highlights</a></li>
<li><a class="nav-link"
onclick="showPage('merch')">Merch</a></li>
<li><a class="nav-link"
onclick="showPage('join')">Join</a></li>
</ul>
</nav>
</div>
</header>

<section id="home" class="page-section active">


<h1>ONE TEAM<br>ONE DREAM</h1>
<p>Best Basketball Team in Hanoi-Amsterdam High School</p>
<button onclick="showPage('join')" class="btn">Register for
Tryouts</button>
</section>

<section id="schedule" class="page-section">


<div class="container">
<h2 class="section-title">Season Schedule</h2>
<div style="overflow-x:auto;">
<table>
<thead>
<tr>
<th>Date/Time</th>
<th>Details</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Nov
30</strong><br>Finished</td>
<td><strong>vs Lonelystonie</strong> @ Bay
Arena<br><span class="win">Result: W 85-78</span></td>
</tr>
<tr>
<td><strong>Dec 1</strong><br>Finished</td>
<td><strong>vs East End Eagles</strong> @
Thai Tuan Club<br><span class="loss">Result: L 90-92</span></td>
</tr>
<tr>
<td><strong>Dec 8</strong><br>7:00 PM</td>
<td><strong>vs CDunk</strong> @ Ams Main
Court</td>
</tr>
<tr>
<td><strong>Dec 10</strong><br>6:30 PM</td>
<td><strong>vs Hanoi Buffaloes</strong> @
HC Club</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>

<section id="vision" class="page-section">


<div class="container">
<h2 class="section-title">Why We Play</h2>
<p style="text-align: center; margin-bottom: 40px; max-
width: 800px; margin-left: auto; margin-right: auto;">
Founded by the students of 12 Physics 1, K8 Tam Son is
more than just a basketball squad.
We established this club to create a legacy of
athleticism, brotherhood, and discipline.
</p>
<div class="goals-grid">
<div class="goal-card">
<span class="goal-icon">🤝</span>
<h3>Brotherhood</h3>
<p>Strengthening the bond between class members
through the challenges of competitive sports.</p>
</div>
<div class="goal-card">
<span class="goal-icon">🔥</span>
<h3>Passion</h3>
<p>Promoting a healthy lifestyle and a burning
passion for basketball.</p>
</div>
<div class="goal-card">
<span class="goal-icon">🏆</span>
<h3>Legacy</h3>
<p>Aim to prove that Physics students aren't just
academic achievers, but champions.</p>
</div>
</div>
</div>
</section>

<section id="roster" class="page-section">


<div class="container">
<h2 class="section-title">Our Athletes</h2>
<div class="roster-grid">

<div class="player-card">
<img
src="[Link]
9/576157457_849119010860407_7122313793334489991_n.jpg?
_nc_cat=102&ccb=1-
7&_nc_sid=9f807c&_nc_ohc=Tq7dfplcU2oQ7kNvwEDxpaJ&_nc_oc=AdnlmO8MT6qBvrX
KPzGX2Ln1PQ6ZAqZ0nHgsHvALvsby9tcYyR5YSx7k0Fm1QMvkHHqYRx9uCin6uEUWudXFbP
Sd&_nc_zt=23&_nc_ht=scontent.fhph6-
[Link]&oh=03_Q7cD4AEL6pa6QOviT66T6HH4wYKtgsumdsb1oKl_lTPn0oHKbw&oe=695CE
124" alt="Player" class="player-img">
<div class="player-info">
<span class="player-number">#22</span>
<h3 class="player-name">Le Nam Khanh</h3>
<p class="player-pos">Point Guard</p>

<table class="stats-table">
<thead>
<tr>

<th>PTS</th><th>AST</th><th>REB</th><th>STL</th><th>BLK</th>
</tr>
</thead>
<tbody>
<tr>

<td>18.5</td><td>7.2</td><td>4.1</td><td>2.3</td><td>0.4</td>
</tr>
</tbody>
</table>
<table class="stats-table">
<thead>
<tr>

<th>FG%</th><th>3P%</th><th>FT%</th>
</tr>
</thead>
<tbody>
<tr>

<td>48%</td><td>38%</td><td>85%</td>
</tr>
</tbody>
</table>
</div>
</div>

<div class="player-card">
<img
src="[Link]
9/400001102_738186664848483_21737200751201411_n.jpg?_nc_cat=100&ccb=1-
7&_nc_sid=9f807c&_nc_ohc=swPX_M9MEz4Q7kNvwG7gC42&_nc_oc=AdkzX8N1fe-
dTgWrr64OGON5sWt0JXvmctnWdUY1Zu7GAG62UaW-A62PVJja9meQqwWBAT9yemf-
prsVMNkCSWoD&_nc_zt=23&_nc_ht=[Link]&oh=03_Q7cD4AE9YaOT6-
sopGg87YFeMmHkJcXKO5eIqJP_KZ6aIJSm5A&oe=695CDFC8" alt="Player"
class="player-img">
<div class="player-info">
<span class="player-number">#10</span>
<h3 class="player-name">Tran Viet Thanh</h3>
<p class="player-pos">Shooting Guard</p>
<table class="stats-table">
<thead>
<tr>

<th>PTS</th><th>AST</th><th>REB</th><th>STL</th><th>BLK</th>
</tr>
</thead>
<tbody>
<tr>

<td>22.4</td><td>3.1</td><td>5.2</td><td>1.1</td><td>0.2</td>
</tr>
</tbody>
</table>
<table class="stats-table">
<thead>
<tr>

<th>FG%</th><th>3P%</th><th>FT%</th>
</tr>
</thead>
<tbody>
<tr>

<td>45%</td><td>42%</td><td>90%</td>
</tr>
</tbody>
</table>
</div>
</div>

<div class="player-card">
<img
src="[Link]
9/403612258_285002904081072_4044604233975275119_n.jpg?
_nc_cat=107&ccb=1-
7&_nc_sid=9f807c&_nc_ohc=xGL_i4hwNkQQ7kNvwFp4rYH&_nc_oc=AdnFD-
pCoJUOIlQW-
3WKNZcurbrLnv2M9iAqWHmfoz0oQmlC2F6EipOeBZfNYtx4XL9oOnx6wJGkEEgnK6yn0xXq
&_nc_zt=23&_nc_ht=scontent.fhph6-
[Link]&oh=03_Q7cD4AHm3ULynT829UPWJTFvFO0xxks7GS_X0f95_t8GC2V4vw&oe=695CF
1EB" alt="Player" class="player-img">
<div class="player-info">
<span class="player-number">#16</span>
<h3 class="player-name">Bui Minh Duc</h3>
<p class="player-pos">Small Forward</p>
<table class="stats-table">
<thead>
<tr>

<th>PTS</th><th>AST</th><th>REB</th><th>STL</th><th>BLK</th>
</tr>
</thead>
<tbody>
<tr>

<td>15.0</td><td>4.5</td><td>6.8</td><td>1.5</td><td>0.8</td>
</tr>
</tbody>
</table>
<table class="stats-table">
<thead>
<tr>

<th>FG%</th><th>3P%</th><th>FT%</th>
</tr>
</thead>
<tbody>
<tr>

<td>50%</td><td>35%</td><td>78%</td>
</tr>
</tbody>
</table>
</div>
</div>

<div class="player-card">
<img
src="[Link]
9/592096708_831434289448375_8731343579617007280_n.jpg?
_nc_cat=103&ccb=1-7&_nc_sid=9f807c&_nc_ohc=UUMSbe-
v2z4Q7kNvwFpf7z9&_nc_oc=AdmyC3OJE8ox4MpB4b14ECT1OFFigq4WUljEiiSvCtDMlPw
XAA3ciMZPnkUb_1eib0nP36y3J1qKBjbBp5hOMqXt&_nc_zt=23&_nc_ht=[Link]
h6-
[Link]&oh=03_Q7cD4AES3cbND1uU_XlyQ_cXsgKSnuZ4eDRVbrMX4EWlJMPG5A&oe=695CD
8B3" alt="Player" class="player-img">
<div class="player-info">
<span class="player-number">#08</span>
<h3 class="player-name">Tran Vu Hai Son</h3>
<p class="player-pos">Power Forward</p>
<table class="stats-table">
<thead>
<tr>

<th>PTS</th><th>AST</th><th>REB</th><th>STL</th><th>BLK</th>
</tr>
</thead>
<tbody>
<tr>

<td>12.5</td><td>2.0</td><td>9.5</td><td>0.8</td><td>1.2</td>
</tr>
</tbody>
</table>
<table class="stats-table">
<thead>
<tr>

<th>FG%</th><th>3P%</th><th>FT%</th>
</tr>
</thead>
<tbody>
<tr>

<td>55%</td><td>25%</td><td>65%</td>
</tr>
</tbody>
</table>
</div>
</div>

<div class="player-card">
<img
src="[Link]
9/593584489_707941745704075_4439238570270693233_n.jpg?
_nc_cat=111&ccb=1-
7&_nc_sid=9f807c&_nc_ohc=6LN1ZRhMXiQQ7kNvwGp3gg5&_nc_oc=AdlIs0au0dKahvr
SP4rCa6V_3br4-PXSd2IwjIYM_Xg7L19i5ckTdIt-6dGl_Xh6kE3pBY-
ZfLFe0zeUNWMVEqeA&_nc_zt=23&_nc_ht=scontent.fhph6-
[Link]&oh=03_Q7cD4AFD2XqDg-
osjdQGhRcevQaIRbMdDg4ExX9_3lJTPF9daA&oe=695CCB27" alt="Player"
class="player-img">
<div class="player-info">
<span class="player-number">#03</span>
<h3 class="player-name">Ta Xuan Bach</h3>
<p class="player-pos">Center</p>
<table class="stats-table">
<thead>
<tr>

<th>PTS</th><th>AST</th><th>REB</th><th>STL</th><th>BLK</th>
</tr>
</thead>
<tbody>
<tr>

<td>10.0</td><td>1.5</td><td>12.2</td><td>0.5</td><td>2.5</td>
</tr>
</tbody>
</table>
<table class="stats-table">
<thead>
<tr>

<th>FG%</th><th>3P%</th><th>FT%</th>
</tr>
</thead>
<tbody>
<tr>
<td>60%</td><td>0%</td><td>55%</td>
</tr>
</tbody>
</table>
</div>
</div>

</div>
</div>
</section>

<section id="highlights" class="page-section">


<div class="container">
<h2 class="section-title">Highlights Reels</h2>
<div class="highlights-grid">
<div class="video-card">
<div class="video-wrapper">
<iframe width="560" height="315" src=""
title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-
picture; web-share" referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen></iframe>
</div>
<div class="video-title">Hai Son - Outstanding
Plays</div>
</div>
<div class="video-card">
<div class="video-wrapper">
<iframe width="560" height="315" src=""
title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-
picture; web-share" referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen></iframe>
</div>
<div class="video-title">Top 10 Plays of the
Season</div>
</div>
<div class="video-card">
<div class="video-wrapper">
<iframe width="560" height="315" src=""
title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-
picture; web-share" referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen></iframe>
</div>
<div class="video-title">Defense compilation: The
Wall</div>
</div>
</div>
</div>
</section>

<section id="merch" class="page-section">


<div class="container">
<h2 class="section-title">K8 Tam Son Store</h2>
<div class="merch-grid">
<div class="merch-item">
<img
src="[Link]
15_195841-[Link]" alt="Jersey" class="merch-img">
<h3>Official Jersey (Home)</h3>
<span class="merch-price">350.000₫</span>
<button class="btn-buy">Pre-order Now</button>
</div>
<div class="merch-item">
<img
src="[Link]
18_180221-[Link]" alt="Hoodie" class="merch-img">
<h3>Physics 1 "Legacy" Hoodie</h3>
<span class="merch-price">450.000₫</span>
<button class="btn-buy">Pre-order Now</button>
</div>
<div class="merch-item">
<img
src="[Link]
[Link]" alt="Shoes" class="merch-img">
<h3>K8 Signature Basketball Shoes</h3>
<span class="merch-price">1.200.000₫</span>
<button class="btn-buy">Out of Stock</button>
</div>
</div>
</div>
</section>
<section id="join" class="page-section">
<div class="container form-container">
<h2 class="section-title">Join our Team!</h2>
<form onsubmit="alert('Registration submitted!'); return
false;">
<div class="form-group">
<label for="fullName">Full Name</label>
<input type="text" id="fullName" name="fullName"
required>
</div>
<div class="form-group">
<label for="email">Email Address</label>
<input type="email" id="email" name="email"
required>
</div>
<div class="form-group">
<label for="position">Position</label>
<select id="position" name="position">
<option value="PG">Point Guard</option>
<option value="SG">Shooting Guard</option>
<option value="SF">Small Forward</option>
<option value="PF">Power Forward</option>
<option value="C">Center</option>
</select>
</div>
<div class="form-group">
<label for="experience">Experience</label>
<textarea id="experience" name="experience"
rows="4"></textarea>
</div>
<button type="submit" class="btn" style="width:
100%;">Submit Registration</button>
</form>
</div>
</section>

<footer>
<div class="container">
<h3 style="color: #fff; margin-bottom: 10px;">Our
Sponsors</h3>
<div class="sponsors-grid">
<a
href="[Link]
target="_blank">
<img
src="[Link]
1307134357061997664_n.jpg" alt="HABT" class="sponsor-img">
</a>
<a href="[Link]
locale=vi_VN" target="_blank">
<img
src="[Link]
683971421801363737_n.jpg" alt="Ams Crew" class="sponsor-img">
</a>
</div>
<p style="margin-top: 20px;">&copy; 2024 K8 Tam Son
Basketball Team. All Rights Reserved.</p>
</div>
</footer>

<script>
function showPage(pageId) {
const sections = [Link]('.page-
section');
[Link](section => {
[Link]('active');
});

const targetSection = [Link](pageId);


if (targetSection) {
[Link]('active');
}

const navLinks = [Link]('.nav-link');


[Link](link => {
[Link]('active');
if ([Link]('onclick').includes(pageId)) {
[Link]('active');
}
});

if(pageId !== 'home') {


[Link]({ top: 0, behavior: 'smooth' });
}
}
</script>
</body>
</html>

You might also like