korboduo/concortex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: korboduo:d2a382ffd93fa6efdbf5b4a7f478fe267c0bbee5
Branches Tags
korboduo:main
...
compare: korboduo:main
Branches Tags
korboduo:main

6 Commits
d2a382ffd9 ... main

Author SHA1 Message Date
Korbo Duo
dd337e04e0 bg set to cover and autofits height to viewport 2025-09-29 12:57:44 +09:00
korboduo
5e41be39a4 optimized and added license 2025-09-26 13:07:17 +09:00
korboduo
fb51d1064c test change 2025-09-26 11:37:27 +09:00
korboduo
d3ddc72ed2 links change 2025-09-26 09:42:00 +09:00
Korbo Duo
2ff28605bf simple dynamic grid 2025-09-19 09:44:29 +09:00
Korbo Duo
fd1e7df85d test 2025-09-18 22:07:13 +09:00
5 changed files with 78 additions and 61 deletions
Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
files/

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.

2
README.md
View File

@@ -0,0 +1,2 @@
## con.cortex site
yeah

31
index.html
View File

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

86
style.css
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-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-Regular.ttf') format('truetype');
font-weight: normal;
font-weight: 400;
font-style: normal;
}
.nerd-icon {
font-size: 32px;
color: #333;
@font-face {
font-family: 'SauceCodePro NF';
src: url('fonts/SauceCodeProNerdFont-Italic.ttf') format('truetype');
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 {
margin: 0;
padding: 0;
height: 100%;
font-family: Arial, sans-serif;
font-family: 'SauceCodePro NF', monospace;
display: flex;
flex-direction: column;
justify-content: center;
@@ -26,49 +46,26 @@ body, html {
user-select: none;
}
.background {
position: fixed;
top: 0;
left: 0;
background: url('images/bg.png') center center / cover no-repeat;
height: 100vh;
width: 100%;
height: 100%;
background: url('images/bg.png') center center / contain no-repeat;
background-size: auto;
z-index: 0;
pointer-events: none;
}
.logo-header {
font-family: 'SauceCodePro NF', serif;
font-weight: 400;
font-size: 48px;
color: white;
position: relative;
z-index: 1;
}
.logo-header img {
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 */
.grid-container {
display: grid;
grid-template-columns: repeat(4, 120px);
@@ -78,8 +75,16 @@ body, html {
z-index: 1;
}
@media (max-width: 768px) {
.grid-container {
grid-template-columns: repeat(3, 90px);
grid-template-rows: repeat(4, 90px);
gap: 20px;
margin-top: 40px;
}
}
.grid-item {
font-family: 'SauceCodePro NF', serif;
background: white;
display: flex;
justify-content: center;
@@ -115,3 +120,14 @@ body, html {
background: transparent;
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;
}