optimized and added license

This commit is contained in:
korboduo 2025-09-26 13:07:17 +09:00
parent fb51d1064c
commit 5e41be39a4
3 changed files with 61 additions and 50 deletions

13
LICENSE Normal file
View File

@ -0,0 +1,13 @@
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
Version 2, December 2004
Copyright (C) 2025 KorboDuo <korboduo@gmail.com>
Everyone is permitted to copy and distribute verbatim or modified
copies of this license document, and changing it is allowed as long
as the name is changed.
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
0. You just DO WHAT THE FUCK YOU WANT TO.

View File

@ -11,40 +11,33 @@
<div class="background"></div> <div class="background"></div>
<!-- Header logo -->
<header class="logo-header"> <header class="logo-header">
<p><span style="color: #FF4B4B;">con.</span>cortex</p> <p><span style="color: #FF4B4B;">con.</span>cortex</p>
</header> </header>
<div class="grid-container"> <div class="grid-container">
<div class="grid-item"> <div class="grid-item">
<a href="https://www.youtube.com/@KorboDuo" class="grid-link" style="color: #FF4B4B;">&#xf16a;</a> <a href="https://www.youtube.com/@KorboDuo" class="grid-link" style="color: #FF4B4B;">&#xf16a;</a>
</div> </div>
<div class="grid-item"> <div class="grid-item">
<a href="https://github.com/korboduo" class="grid-link">&#xf09b;</a> <a href="https://github.com/korboduo" class="grid-link">&#xf09b;</a>
</div> </div>
<div class="grid-item"></div> <div class="grid-item"></div>
<div class="grid-item">
<div class="grid-item">
<a href="https://www.twitch.tv/korboduo" class="grid-link">&#xf1e8;</a> <a href="https://www.twitch.tv/korboduo" class="grid-link">&#xf1e8;</a>
</div> </div>
<div class="grid-item"></div>
<div class="grid-item"></div>
<div class="grid-item"> <div class="grid-item">
<a href="https://korboduo.itch.io/" class="grid-link" style="color: #FF4B4B;">&#xef99;</a> <a href="https://korboduo.itch.io/" class="grid-link" style="color: #FF4B4B;">&#xef99;</a>
</div> </div>
<div class="grid-item"> <div class="grid-item">
<a href="https://www.youtube.com/@concortex" class="grid-link">&#xf16a;</a> <a href="https://www.youtube.com/@concortex" class="grid-link">&#xf16a;</a>
</div> </div>
</div> </div>
<footer class="footer">
KorboDuo © 2025 — Licensed under <a href="LICENSE" target="_blank">WTFPL</a>
</footer>
</body> </body>
</html> </html>

View File

@ -1,21 +1,41 @@
/* Import all font weights and styles */
@font-face {
font-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face { @font-face {
font-family: 'SauceCodePro NF'; font-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-Regular.ttf') format('truetype'); src: url('fonts/SauceCodeProNerdFont-Regular.ttf') format('truetype');
font-weight: normal; font-weight: 400;
font-style: normal; font-style: normal;
} }
@font-face {
.nerd-icon { font-family: 'SauceCodePro NF';
font-size: 32px; src: url('fonts/SauceCodeProNerdFont-Italic.ttf') format('truetype');
color: #333; font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-BoldItalic.ttf') format('truetype');
font-weight: 700;
font-style: italic;
} }
/* Base reset and layout */
body, html { body, html {
margin: 0; margin: 0;
padding: 0; padding: 0;
height: 100%; height: 100%;
font-family: Arial, sans-serif; font-family: 'SauceCodePro NF', monospace;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@ -26,7 +46,6 @@ body, html {
user-select: none; user-select: none;
} }
.background { .background {
position: fixed; position: fixed;
top: 0; top: 0;
@ -34,41 +53,19 @@ body, html {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: url('images/bg.png') center center / contain no-repeat; background: url('images/bg.png') center center / contain no-repeat;
background-size: auto;
z-index: 0; z-index: 0;
pointer-events: none; pointer-events: none;
} }
.logo-header { .logo-header {
font-family: 'SauceCodePro NF', serif; font-weight: 400;
font-size: 48px; font-size: 48px;
color: white; color: white;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
.logo-header img { /* Grid */
max-width: 200px;
width: 40%;
height: auto;
display: block;
}
.center-image {
position: relative;
z-index: 1;
margin-top: 20px;
resize: none;
}
.center-image img {
max-width: 250px;
width: 50%;
height: auto;
display: block;
margin: 0 auto;
}
.grid-container { .grid-container {
display: grid; display: grid;
grid-template-columns: repeat(4, 120px); grid-template-columns: repeat(4, 120px);
@ -80,17 +77,14 @@ body, html {
@media (max-width: 768px) { @media (max-width: 768px) {
.grid-container { .grid-container {
display: grid;
grid-template-columns: repeat(3, 90px); grid-template-columns: repeat(3, 90px);
grid-template-rows: repeat(4, 90px); grid-template-rows: repeat(4, 90px);
gap: 20px; gap: 20px;
margin-top: 40px; margin-top: 40px;
z-index: 1;
} }
} }
.grid-item { .grid-item {
font-family: 'SauceCodePro NF', serif;
background: white; background: white;
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -126,3 +120,14 @@ body, html {
background: transparent; background: transparent;
pointer-events: none; pointer-events: none;
} }
/* Footer */
.footer {
position: absolute;
bottom: 18px;
font-size: 14px;
color: #ddd;
font-weight: 300;
font-family: 'SauceCodePro NF', monospace;
z-index: 1;
}