Initial commit
This commit is contained in:
267
res/index.html
Normal file
267
res/index.html
Normal file
@@ -0,0 +1,267 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>webpage</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap" rel="stylesheet">
|
||||
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=arrow_downward" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- eye-catcher -->
|
||||
<header class="column-display" style="min-height: 100svh;">
|
||||
<div style="flex: 0.2;"></div>
|
||||
|
||||
<h1 style="text-align: left; font-size: 1.5vw; font-style: italic;">From The Hatsune Discord staff team</h1>
|
||||
<h1 style="font-size: 6vw;" class="attention">LOTS HAPPENED IN 2025.</h1>
|
||||
<h1 style="text-align: right; font-size: 2vw;">We would like to present the highlights.</h1>
|
||||
|
||||
<div style="flex: 1;"></div>
|
||||
|
||||
<h1 style="font-size: 2vw;">See Below</h1>
|
||||
<span class="material-symbols-outlined" style="text-align: center; user-select: none; font-size: 2vw;">arrow_downward</span>
|
||||
|
||||
<div style="flex: 0.2;"></div>
|
||||
</header>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top reactions -->
|
||||
<div style="padding: 0 5vw 0 5vw">
|
||||
<h2 style="font-size: 4vw; margin-bottom: 0;"><span style="font-weight: 300;">Is it just me,</span> or is it comfy in here?</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are the top 10 most used reactions:</h2>
|
||||
<ul>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1136028749557678103.webp?size=128&animated=true" title=":squishycomfy:">
|
||||
<span style="padding-left: 10px;">x13,594</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1152034831392317483.webp?size=128" title=":comfypog:">
|
||||
<span style="padding-left: 10px;">x9,723</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/960550152689582171.webp?size=128" title=":mikukek:">
|
||||
<span style="padding-left: 10px;">x6,471</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1173629360276787222.webp?size=128" title=":39:">
|
||||
<span style="padding-left: 10px;">x5,275</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1336108168564052008.webp?size=128" title=":MikuTrue:">
|
||||
<span style="padding-left: 10px;">x3,885</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/961556069623148614.webp?size=128" title=":MikuLogo:">
|
||||
<span style="padding-left: 10px;">x3,704</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1224530638095519804.webp?size=128" title=":comfypat:">
|
||||
<span style="padding-left: 10px;">x2,809</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1049144884004659291.webp?size=128" title=":mikuwave:">
|
||||
<span style="padding-left: 10px;">x2,742</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1173317846676275230.webp?size=128" title=":Miku39Sekai:">
|
||||
<span style="padding-left: 10px;">x2,610</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1175603450852147262.webp?size=128" title=":40Sekai:">
|
||||
<span style="padding-left: 10px;">x2,460</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top emotes -->
|
||||
<div style="padding: 0 5vw 0 5vw">
|
||||
<h2 style="font-size: 4vw; margin-bottom: 0;">Add some spice to your message.</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are the top 10 most used emojis:</h2>
|
||||
<ul>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/960550152689582171.webp?size=128" title=":mikukek:">
|
||||
<span style="padding-left: 10px;">x10,285</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1158974570699685988.webp?size=128" title=":mikulaugh:">
|
||||
<span style="padding-left: 10px;">x9,442</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1184633291970711552.webp?size=128" title=":Comfymiku:">
|
||||
<span style="padding-left: 10px;">x7,687</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1152034831392317483.webp?size=128" title=":comfypog:">
|
||||
<span style="padding-left: 10px;">x5,466</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1173629360276787222.webp?size=128" title=":39:">
|
||||
<span style="padding-left: 10px;">x5,151</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/959890966318305311.webp?size=128" title=":mikucrying:">
|
||||
<span style="padding-left: 10px;">x3,686</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1172969588527476896.webp?size=128" title=":MikuPeek:">
|
||||
<span style="padding-left: 10px;">x3,179</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/973881754718973982.webp?size=44" title=":mikuthink:">
|
||||
<span style="padding-left: 10px;">x2,664</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1017123249802444911.webp?size=44&animated=true" title=":Mikulaugh:">
|
||||
<span style="padding-left: 10px;">x2,626</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://cdn.discordapp.com/emojis/1173317846676275230.webp?size=44" title=":Miku39Sekai:">
|
||||
<span style="padding-left: 10px;">x2,394</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top stickers -->
|
||||
<div style="padding: 0 5vw 0 5vw">
|
||||
<h2 style="font-size: 4vw; margin-bottom: 0;">Stickerbomb!</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are the top 10 most used stickers:</h2>
|
||||
<ul>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1421313906953158848.png?size=128&quality=lossless" title="Best Friend 39">
|
||||
<span style="padding-left: 10px;">x624</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1143787295758106734.png?size=128&quality=lossless" title="MikuHiiiiiiiiii">
|
||||
<span style="padding-left: 10px;">x311</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1014423095135698994.png?size=128&quality=lossless" title="mikumouth">
|
||||
<span style="padding-left: 10px;">x250</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1338655635532939368.png?size=128&quality=lossless" title="MikuPleading">
|
||||
<span style="padding-left: 10px;">x216</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/961195007291842620.png?size=128&quality=lossless" title="Miku gun">
|
||||
<span style="padding-left: 10px;">x194</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1364439643734671461.png?size=128&quality=lossless" title="VampireMiku39">
|
||||
<span style="padding-left: 10px;">x168</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1104841444092559502.png?size=128&quality=lossless" title="MikuDepressed">
|
||||
<span style="padding-left: 10px;">x148</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1151384489260499004.png?size=128" title="Comfy Sleep">
|
||||
<span style="padding-left: 10px;">x111</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1106428089866649650.png?size=128&quality=lossless" title="MikuWithAGunWithoutAGun">
|
||||
<span style="padding-left: 10px;">x110</span>
|
||||
</li>
|
||||
<li class="emoji-line-center">
|
||||
<img class="emoji" src="https://media.discordapp.net/stickers/1152286791706083389.png?size=128&quality=lossless" title="Show">
|
||||
<span style="padding-left: 10px;">x110</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- # of messages -->
|
||||
<div class="column-display" style="min-height: 75svh;">
|
||||
<div style="flex: 0.2;"></div>
|
||||
<h1 style="font-size: 5vw; text-align: center; margin-bottom: 0;">Let's talk messages.</h1>
|
||||
<h1 style="font-size: 6vw; text-align: center; font-weight: 300; margin-top: 0;">We sent <span style="font-weight: 900;">1,091,742 of them.</span></h1>
|
||||
<h1 style="font-size: 2vw; text-align: center;">Jeez.</h1>
|
||||
<div style="flex: 0.2;"></div>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top message reactions -->
|
||||
<div style="padding: 0 5vw 0 5vw; font-size: 1.5vw;">
|
||||
<h2 style="font-size: 3.2vw; margin-bottom: 0;">Some of those messages were pretty popular.</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are each month's most reacted messages:</h2>
|
||||
<ul>
|
||||
<li>January: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1327391825639506022" style="color: white;">#general-01 by powerblade3</a> - 220</li>
|
||||
<li>February: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1336869960051462214" style="color: white;">#general-01 by mikuoctoling39</a> - 119</li>
|
||||
<li>March: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1349444678029938739" style="color: white;">#general-01 by miku.hatsune</a> - 99</li>
|
||||
<li>April: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1356428710395383900" style="color: white;">#general-01 by bready_todie</a> - 93</li>
|
||||
<li>May: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1370759579377467523" style="color: white;">#general-01 by powerblade3</a> - 95</li>
|
||||
<li>June: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1384016890619498539" style="color: white;">#general-01 by .metalgoosesolid</a> - 60</li>
|
||||
<li>July: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1394904034338672742" style="color: white;">#general-01 by kelcody</a> - 132</li>
|
||||
<li>August: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1410694444570644590" style="color: white;">#general-01 by miku.hatsune</a> - 111</li>
|
||||
<li>September: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1413968705410564146" style="color: white;">#general-01 by miku.hatsune</a> - 95</li>
|
||||
<li>October: <a href="https://discord.com/channels/959218185356328960/960713007955079218/1424936706376863764" style="color: white;">#randomness-and-memes by yokoo99</a> - 95</li>
|
||||
<li>November: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1440808203137847446" style="color: white;">#general-01 by iam_stove</a> - 52</li>
|
||||
<li>December: <a href="https://discord.com/channels/959218185356328960/960712970831278180/1453468290897809510" style="color: white;">#general-01 by zunda_nectar</a> - 66</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top message counts -->
|
||||
<div style="padding: 0 5vw 0 5vw; font-size: 1.5vw;">
|
||||
<h2 style="font-size: 3.2vw; margin-bottom: 0;">We had several keyboard warriors.</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are the top 10 users with the most messages:</h2>
|
||||
<ul>
|
||||
<li>@miraigummies - 52746</li>
|
||||
<li>@koolaidkan - 42391</li>
|
||||
<li>@iam_stove - 35365</li>
|
||||
<li>@39.mik - 31435</li>
|
||||
<li>@ballisticchillz - 30283</li>
|
||||
<li>@powerblade3 - 29304</li>
|
||||
<li>@miku.hatsune - 28421</li>
|
||||
<li>@zunda_nectar - 28119</li>
|
||||
<li>@simplename21 - 23234</li>
|
||||
<li>@kelcody - 22782</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<!-- top 39 interactions -->
|
||||
<div style="padding: 0 5vw 0 5vw; font-size: 1.5vw;">
|
||||
<h2 style="font-size: 3.2vw; margin-bottom: 0;">You were always here with us.</h2>
|
||||
<h2 style="font-size: 2vw; margin-top: 0;">Here are the top 10 users with the most '39' messages:</h2>
|
||||
<ul>
|
||||
<li>@iam_stove - 3790</li>
|
||||
<li>@aozora39 - 3445</li>
|
||||
<li>@cfm_megurine_luka - 3325</li>
|
||||
<li>@starlitsleep - 2707</li>
|
||||
<li>@miku.hatsune - 2371</li>
|
||||
<li>@powerblade3 - 1883</li>
|
||||
<li>@the_apricity_effect - 1706</li>
|
||||
<li>@yokoo99 - 1354</li>
|
||||
<li>@_1v40_ - 1294</li>
|
||||
<li>@iam_stove - 1262</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<hr class="break"></hr>
|
||||
|
||||
<h2 style="font-size: 2.6vw; text-align: center;">Thank you all for a great year! We're here to share the next with you.</h2>
|
||||
|
||||
<footer style="padding: 3vh 0 3vh;">
|
||||
<div style="text-align: center;">
|
||||
<a href="https://gitea.proxnet.dev/zombieb/hatsune-2025-stats" style="color: white;">Open-source.</a>
|
||||
100% human-generated. Page design by (@zombieb). Data by (@poco0317).
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<link rel="stylesheet" href="./style.css">
|
||||
</body>
|
||||
</html>
|
||||
42
res/style.css
Normal file
42
res/style.css
Normal file
@@ -0,0 +1,42 @@
|
||||
.attention {
|
||||
font-optical-sizing: auto;
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0 5vw 0 5vw;
|
||||
|
||||
font-family: "DM Sans", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
background: #12db9f;
|
||||
background: linear-gradient(180deg,rgba(18, 219, 159, 1) 0%, rgba(87, 184, 199, 1) 79%);
|
||||
|
||||
color: white;
|
||||
}
|
||||
|
||||
.column-display {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.break {
|
||||
color: white;
|
||||
opacity: 50%;
|
||||
width: 75vw;
|
||||
}
|
||||
|
||||
.emoji-line-center {
|
||||
padding: 15px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
font-size: 3vw;
|
||||
}
|
||||
|
||||
.emoji {
|
||||
width: 128px;
|
||||
}
|
||||
Reference in New Issue
Block a user