Radiquum/radiquum.github.io
1
0
Fork 0
mirror of https://github.com/Radiquum/radiquum.github.io.git synced 2025-04-05 15:54:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add characters page

Browse source
This commit is contained in:
Kentai Radiquum 2024-12-10 15:08:23 +05:00
parent 742fb28189
commit 245a064556
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
11 changed files with 222 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

92
characters.html Normal file
View file

@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kentai Radiquum</title>
<meta name="description"
content="Tech enthusiast with a passion for software development and self-hosting through my wah.su project. I'm also into photography and a big fan of red pandas, curating a collection of 3000+ photos and stickers telegram channel. I enjoy a variety of music genres, especially EDM, Tech, and Alternative. Feel free to reach out via instant messengers in the links section!">
<link href="./static/tailwind.css" rel="stylesheet">
<link rel="apple-touch-icon" sizes="180x180" href="./static/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./static/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./static/favicon/favicon-16x16.png">
<link rel="manifest" href="./site.webmanifest">
<meta property="og:type" content="website">
<meta property="og:title" content="Kentai Radiquum">
<meta property="og:url" content="https://radiquum.wah.su">
<meta property="og:image" content="https://radiquum.wah.su/static/opengraph.png">
<meta property="og:image:type" content="image/png">
<meta property="og:description"
content="Tech enthusiast with a passion for software development and self-hosting through my wah.su project. I'm also into photography and a big fan of red pandas, curating a collection of 3000+ photos and stickers telegram channel. I enjoy a variety of music genres, especially EDM, Tech, and Alternative. Feel free to reach out via instant messengers in the links section!">
<meta property="og:image:width" content="1203">
<meta property="og:image:height" content="627">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Kentai Radiquum">
<meta name="twitter:site" content="@radiquum">
<meta name="twitter:description"
content="Tech enthusiast with a passion for software development and self-hosting through my wah.su project. I'm also into photography and a big fan of red pandas, curating a collection of 3000+ photos and sti">
<meta name="twitter:image" content="https://radiquum.wah.su/static/opengraph.png">
</head>
<body class="overflow-x-hidden bg-bg-black">
<header class="w-full text-white bg-bg-pink" id="header">
<div class="container flex flex-wrap gap-1 mx-auto sm:items-center sm:justify-between">
<a href="./index.html#landing">
<div class="flex items-center gap-4 px-4 py-2 sm:py-4">
<img src="./static/avatar_512.png" alt="" class=" rounded-lg w-[64px] lg:w-[64px] 2xl:w-[64px]" />
<h1 class="text-2xl font-semibold xl:text-3xl 2xl:text-4xl" data-i18n="NAME">KENTAI RADIQUUM</h1>
</div>
</a>
<div class="flex gap-1 px-4 mb-2 sm:px-0 sm:gap-2">
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="./index.html#about"
data-i18n="BTN_ABOUT_ME">ABOUT</a>
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="./index.html#links"
data-i18n="BTN_LINKS">LINKS</a>
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="./characters.html"
data-i18n="BTN_CHARACTERS">CHARACTERS</a>
</div>
</div>
</header>
<div class="flex flex-col flex-wrap w-full lg:flex-row">
<a class="group" href="./characters/KentaiRadiquum.html">
<div class="w-full lg:max-w-[50vw] relative">
<div
class="absolute inset-0 flex flex-col justify-end p-4 text-white bg-black bg-opacity-50 group-hover:opacity-25">
<p class="md:text-xl" data-i18n="CHR_KR_GOTO">Click to go to description</p>
<div>
<h1 class="text-3xl font-bold md:text-6xl">Kentai Radiquum</h1>
<h2 class="text-2xl md:text-4xl" data-i18n="CHR_KR_SPECIES">Red Panda</h2>
</div>
</div>
<img alt="" src="./static/assets/characters/thumb/KentaiRadiquum.jpg" class="object-cover w-full" />
</div>
</a>
<a class="group" href="./static/assets/characters/KentaiBibiquum/Kentai_Bibiquum.jpg"
download="Kentai_Bibiquum.jpg">
<div class="w-full lg:max-w-[50vw] relative">
<div
class="absolute inset-0 flex flex-col justify-end p-4 text-white bg-black bg-opacity-50 group-hover:opacity-25">
<p class="md:text-xl" data-i18n="CHR_KB_GOTO">Click to download Ref</p>
<div>
<h1 class="text-3xl font-bold md:text-6xl">Kentai Bibiquum</h1>
<h2 class="text-2xl md:text-4xl" data-i18n="CHR_KB_SPECIES">Protogen</h2>
</div>
</div>
<img alt="" src="./static/assets/characters/thumb/KentaiBibiquum.jpg" class="object-cover w-full " />
</div>
</a>
</div>
<!-- <script src="./static/script.js"></script> -->
<script src="./static/i18n/strings/ru.js"></script>
<script src="./static/i18n/i18n.js"></script>
</body>
</html>

15
index.html
View file

@ -46,9 +46,11 @@
</a>
<div class="flex gap-1 px-4 mb-2 sm:px-0 sm:gap-2">
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="#about"
data-i18n="BTN_ABOUT_ME">ABOUT ME</a>
data-i18n="BTN_ABOUT_ME">ABOUT</a>
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="#links"
data-i18n="BTN_LINKS">LINKS</a>
<a class="px-4 py-2 rounded-md sm:text-xl hover:underline bg-bg-gray" href="./characters.html"
data-i18n="BTN_CHARACTERS">CHARACTERS</a>
</div>
</div>
</header>
@ -106,13 +108,16 @@
class="flex flex-row flex-wrap items-center justify-center order-3 gap-8 py-4 -mt-4 text-white md:mt-auto md:order-4">
<img src="./static/arrow_downward.svg" alt="" class="hidden w-24 h-24 animate-bounce md:block" />
<p class="hidden text-4xl md:block" data-i18n="BTN_OR">or</p>
<div class="flex flex-row items-center gap-2">
<a class="px-4 py-4 text-2xl underline text-bg-pink hover:underline sm:no-underline" href="#about"
<div class="flex flex-col items-center gap-2 sm:flex-row">
<a class="px-4 text-2xl underline sm:py-4 text-bg-pink hover:underline sm:no-underline" href="#about"
data-i18n="BTN_ABOUT_ME">ABOUT
ME</a>
<span class="text-2xl">/</span>
<a class="px-4 py-4 text-2xl underline text-bg-pink hover:underline sm:no-underline" href="#links"
<span class="hidden text-2xl sm:inline-block">/</span>
<a class="px-4 text-2xl underline sm:py-4 text-bg-pink hover:underline sm:no-underline" href="#links"
data-i18n="BTN_LINKS">LINKS</a>
<span class="hidden text-2xl sm:inline-block">/</span>
<a class="px-4 text-2xl underline sm:py-4 text-bg-pink hover:underline sm:no-underline" href="/characters.html"
data-i18n="BTN_CHARACTERS">CHARACTERS</a>
</div>
</div>

BIN
static/assets/characters/KentaiBibiquum/Kentai_Bibiquum.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 279 KiB

BIN
static/assets/characters/KentaiRadiquum/Kentai_Radiquum.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.5 MiB

BIN
static/assets/characters/KentaiRadiquum/Kentai_Radiquum_EN.pdf Normal file
View file

Binary file not shown.

BIN
static/assets/characters/KentaiRadiquum/Kentai_Radiquum_RU.pdf Normal file
View file

Binary file not shown.

BIN
static/assets/characters/thumb/KentaiBibiquum.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 648 KiB

BIN
static/assets/characters/thumb/KentaiRadiquum.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 400 KiB

14
static/i18n/strings/ru.js
View file

@ -14,6 +14,7 @@ const i18n_ru = {
BTN_ABOUT_ME: "ОБО МНЕ",
BTN_OR: "или",
BTN_LINKS: "ССЫЛКИ",
BTN_CHARACTERS: "ПЕРСОНАЖИ",
// ABOUT ME
CARD_TITLE: "ОБО МНЕ",
@ -41,6 +42,8 @@ const i18n_ru = {
CARD_CONTACT_TITLE: "Связаться",
CARD_CONTACT_DESC:
"Не стесняйтесь связаться со мной в любое время! Способы связаться со мной через мессенджеры доступны в разделе |% LINK='#links' %|ссылок!|% ENDLINK %|.",
// LINKS
LNK_TITLE: "ССЫЛКИ",
LNK_PHOTO_HEADER: "ФОТОГРАФИИ",
LNK_PHOTO_PIXEY: "Смотри фото как в инстаграме",
@ -62,6 +65,17 @@ const i18n_ru = {
LNK_COLLECTION_RPI: "3000+ Фото и видео с красными пандами",
LNK_FRIEND_BLEP: "ВК Группа классного фотографа",
LNK_FRIEND_ITC: "GitHub профиль другого фурри-кодера",
// CHARACTERS
CHR_KR_GOTO: "Нажмите, чтобы перейти к описанию",
CHR_KR_SPECIES: "Красная Панда",
CHR_KB_GOTO: "Нажмите, чтобы скачать референс",
CHR_KB_SPECIES: "Протоген",
// CHR_KR_BIRTH: "Дата рождения",
// CHR_KR_HEIGHT: "Рост",
// CHR_KR_WEIGHT: "Вес",
// CHR_KR_BREED: "Порода",
};
const i18n_ru_style = {

104
static/tailwind.css
View file

@ -746,6 +746,42 @@ video {
height: 100%;
}
.h-screen {
height: 100vh;
}
.h-\[99vh\] {
height: 99vh;
}
.h-\[98vh\] {
height: 98vh;
}
.h-\[95vh\] {
height: 95vh;
}
.h-\[90vh\] {
height: 90vh;
}
.h-\[80vh\] {
height: 80vh;
}
.h-\[85vh\] {
height: 85vh;
}
.h-\[87vh\] {
height: 87vh;
}
.h-\[89vh\] {
height: 89vh;
}
.max-h-\[182px\] {
max-height: 182px;
}
@ -754,6 +790,10 @@ video {
max-height: 50vh;
}
.max-h-screen {
max-height: 100vh;
}
.min-h-screen {
min-height: 100vh;
}
@ -782,6 +822,10 @@ video {
width: 256px;
}
.w-\[50vw\] {
width: 50vw;
}
.w-\[64px\] {
width: 64px;
}
@ -794,6 +838,10 @@ video {
max-width: 50vw;
}
.flex-1 {
flex: 1 1 0%;
}
.-translate-y-full {
--tw-translate-y: -100%;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@ -1057,6 +1105,22 @@ video {
--tw-bg-opacity: 0.5;
}
.bg-opacity-85 {
--tw-bg-opacity: 0.85;
}
.bg-opacity-90 {
--tw-bg-opacity: 0.9;
}
.bg-opacity-5 {
--tw-bg-opacity: 0.05;
}
.bg-opacity-25 {
--tw-bg-opacity: 0.25;
}
.object-contain {
-o-object-fit: contain;
object-fit: contain;
@ -1121,6 +1185,10 @@ video {
text-align: right;
}
.align-bottom {
vertical-align: bottom;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
@ -1151,6 +1219,11 @@ video {
line-height: 1.75rem;
}
.text-6xl {
font-size: 3.75rem;
line-height: 1;
}
.font-bold {
font-weight: 700;
}
@ -1296,6 +1369,10 @@ body {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:opacity-25 {
opacity: 0.25;
}
@media (min-width: 370px) {
.xs\:flex-1 {
flex: 1 1 0%;
@ -1327,6 +1404,10 @@ body {
display: block;
}
.sm\:inline-block {
display: inline-block;
}
.sm\:hidden {
display: none;
}
@ -1443,6 +1524,21 @@ body {
.md\:bg-transparent {
background-color: transparent;
}
.md\:text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
}
.md\:text-6xl {
font-size: 3.75rem;
line-height: 1;
}
.md\:text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
}
}
@media (min-width: 1024px) {
@ -1458,10 +1554,18 @@ body {
width: 64px;
}
.lg\:max-w-\[50vw\] {
max-width: 50vw;
}
.lg\:scroll-mt-4 {
scroll-margin-top: 1rem;
}
.lg\:flex-row {
flex-direction: row;
}
.lg\:text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;

2
tailwind.config.js
View file

@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./index.html"],
content: ["./index.html", "./characters.html"],
theme: {
extend: {
colors: {