Stupid-Cat
/
a.stupid.cat
mirror of https://github.com/AriTheStupidCat/a.stupid.cat.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

ashdlahdkosa

This commit is contained in:
Ari 2026-06-14 04:11:36 +01:00
parent 6319f4fd0d 6b0bc5fa96
commit 0bab8b9ca6
4 changed files with 184 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/media/avatar.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

28
css/fonts.css
View File

@ -1,43 +1,71 @@
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Regular_2022-05-24-151938_hsmz.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 400;
font-style: normal;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Italic_2022-05-24-151939_rdtu.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 400;
font-style: italic;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Medium_2022-05-24-151941_ugqm.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 500;
font-style: normal;
}
@font-face {
<<<<<<< HEAD
font-family: "Comic Code";
src:
url("https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff2")
format("woff2"),
url("https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff")
format("woff");
=======
font-display: swap;
font-family: 'Comic Code';
src: url('https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff2') format('woff2'),
url('https://fonts.doughmination.co.uk/ComicCode-Bold_2022-05-24-152309_zqkm.woff') format('woff');
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
font-weight: 700;
font-style: normal;
}

175
css/index.css
View File

@ -1,13 +1,13 @@
/* IMPORTS */
@import url("fonts.css");
@import url(fonts.css);
@import url(picker.css);
@import url(theme-switcher.css);
@import url("picker.css");
@import url(themes/mocha.css);
@import url(themes/macchiato.css);
@import url(themes/frappe.css);
@import url(themes/latte.css);
@import url(themes/macchiato.css);
@import url(themes/mocha.css);
<<<<<<< HEAD
/* Index.html */
html,
@ -47,6 +47,42 @@ html {
z-index: 1;
width: 100%;
max-width: 460px;
=======
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
height: 100%;
background: linear-gradient(135deg, var(--base) 0%, var(--mantle) 60%, var(--crust) 100%);
}
body {
margin: 0;
min-height: 100vh;
width: 100%;
max-width: 100vw;
overflow-x: hidden;
font-family: 'Comic Code', sans-serif;
background: linear-gradient(135deg, var(--base) 0%, var(--mantle) 60%, var(--crust) 100%);
color: var(--text);
/* top-anchored, horizontally centered, scrollable */
display: flex;
flex-direction: column;
align-items: center;
padding: clamp(2.5rem, 9vh, 6rem) 1.25rem 5rem;
}
/* main content column */
main.intro,
.hub {
width: 100%;
max-width: 480px;
z-index: 1;
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
.pfp {
@ -152,6 +188,7 @@ body::before {
}
@media (max-width: 600px) {
<<<<<<< HEAD
.intro {
margin-top: 10vh;
color: var(--text);
@ -163,6 +200,22 @@ body::before {
margin-top: 1vh;
padding: 1vh;
}
=======
.intro {
color: var(--text);
text-align: center;
padding: 0;
}
.intro-text {
margin-top: 0.75rem;
padding: 0 0.25rem;
}
.hub-header h1 {
font-size: 1.7rem;
}
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
@media (min-width: 768px) {
@ -175,19 +228,41 @@ body::before {
}
}
.intro-text {
max-width: 42ch;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
color: var(--subtext-1);
font-size: 0.98rem;
}
.gitgay-link {
background-color: var(--mauve);
border: none;
color: black;
padding: 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 15px;
font-family: "Comic Code";
background-color: var(--mauve);
border: none;
color: black;
padding: 0.85rem 1.5rem;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1rem;
font-weight: 600;
margin: 4px 2px;
cursor: pointer;
border-radius: 14px;
font-family: "Comic Code";
transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
box-shadow: 0 6px 18px -8px rgba(var(--accent-rgb), 0.7);
}
.gitgay-link:hover {
transform: translateY(-2px);
filter: brightness(1.05);
box-shadow: 0 10px 24px -8px rgba(var(--accent-rgb), 0.8);
}
.gitgay-link:active {
transform: translateY(0);
}
.hub-header,
@ -202,31 +277,32 @@ body::before {
/* ---- 88x31 button wall (always visible on desktop) ---- */
.button-wall {
position: fixed;
bottom: 1rem;
left: 50%;
transform: translateX(-50%);
z-index: 5;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5rem;
max-width: min(90vw, 480px);
position: fixed;
bottom: 1rem;
left: 50%;
transform: translateX(-50%);
z-index: 5;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5rem;
max-width: min(90vw, 480px);
}
/* hide on mobile */
@media (max-width: 768px) {
.button-wall {
display: none;
}
.button-wall {
display: none;
}
}
.button-wall a {
display: block;
line-height: 0;
display: block;
line-height: 0;
}
.button-wall img {
<<<<<<< HEAD
width: 88px;
height: 31px;
image-rendering: pixelated;
@ -235,11 +311,19 @@ body::before {
transition:
transform 0.12s ease,
border-color 0.12s ease;
=======
width: 88px;
height: 31px;
image-rendering: pixelated;
border: 1px solid var(--surface-1);
border-radius: 2px;
transition: transform 0.12s ease, border-color 0.12s ease;
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
.button-wall a:hover img {
transform: translateY(-2px);
border-color: rgb(var(--accent-rgb));
transform: translateY(-2px);
border-color: rgb(var(--accent-rgb));
}
/* Coffee/index.html */
@ -259,6 +343,7 @@ body.message-page {
}
.message-card {
<<<<<<< HEAD
background: var(--surface0);
padding: 2.5rem;
border-radius: 12px;
@ -269,6 +354,18 @@ body.message-page {
line-height: 1.6;
color: var(--text);
border: 1px solid var(--surface1);
=======
background: var(--surface-0);
padding: 2.5rem;
border-radius: 12px;
max-width: 520px;
width: 100%;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
text-align: center;
line-height: 1.6;
color: var(--text);
border: 1px solid var(--surface-1);
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
.message-card h1 {
@ -278,7 +375,11 @@ body.message-page {
}
.message-card p {
<<<<<<< HEAD
color: var(--subtext1);
=======
color: var(--subtext-1);
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
.message-card .ok {
@ -292,9 +393,15 @@ body.message-page {
}
.message-card .muted {
<<<<<<< HEAD
color: var(--overlay1);
font-size: 0.9rem;
margin-top: 1.5rem;
=======
color: var(--overlay-1);
font-size: 0.9rem;
margin-top: 1.5rem;
>>>>>>> 6b0bc5fa96491155661b1597bd88fedf1bace6b8
}
.message-card code {

27
index.html
View File

@ -44,6 +44,7 @@
<!-- Page Title -->
<title>Ari</title>
<link rel="icon" type="image/png" href="/assets/media/favicon.png" />
<link rel="stylesheet" href="/css/index.css">
<script>try { var f = localStorage.getItem('ctpFlavor'); document.documentElement.setAttribute('data-flavor', ['mocha', 'macchiato', 'frappe', 'latte'].indexOf(f) >= 0 ? f : 'mocha'); } catch (e) { document.documentElement.setAttribute('data-flavor', 'mocha'); }</script>
<!-- SEO Meta Tags -->
@ -75,14 +76,12 @@
<meta name="twitter:card" content="summary_image" />
<meta name="twitter:title" content="Ari Stuff" />
<meta name="twitter:description" content="Personal Site for Ari on git.gay" />
<link href="css/index.css" rel="stylesheet" />
<link href="css/picker.css" rel="stylesheet" />
</head>
<body>
<main class="intro">
<header class="hub-header">
<img class="pfp" src="assets/media/avatar.png" alt="Ari avatar">
<img class="pfp" src="assets/media/avatar.webp" alt="Ari avatar" width="96" height="96" fetchpriority="high">
<div>
<h1 class="hey">Hi, I'm<span class="name">Ari</span></h1>
</div>
@ -92,7 +91,7 @@
and just tries to help out whenever she can.
</div>
<div>
<a href="https://git.gay/Ari" target="_blank"><button class="gitgay-link">Check out my Git.Gay</button></a>
<a class="gitgay-link" href="https://git.gay/Ari" target="_blank" rel="noopener">Check out my Git.Gay</a>
</div>
</header>
@ -106,15 +105,15 @@
<img src="/assets/88x31/gitgay.png" alt="GitGay" loading="lazy">
<img src="/assets/88x31/blink.gif" alt="Blink" loading="lazy">
<img src="/assets/88x31/firefox.gif" alt="Firefox" loading="lazy">
<img src="/assets/88x31/nft.gif" alt="NFT" loading="lazy">
<img src="/assets/88x31/noweb32.gif" alt="No Web 3.2" loading="lazy">
<img src="/assets/88x31/meltice.gif" alt="Melt Ice" loading="lazy">
<img src="/assets/88x31/transnow2.gif" alt="Melt Ice" loading="lazy">
<img src="/assets/88x31/nft.gif" alt="NFT" loading="lazy">
<img src="/assets/88x31/noweb32.gif" alt="No Web 3.2" loading="lazy">
<img src="/assets/88x31/meltice.gif" alt="Melt Ice" loading="lazy">
<img src="/assets/88x31/transnow2.gif" alt="Melt Ice" loading="lazy">
</aside>
</body>
<script src="js/index.js"></script>
<script src="js/flavors.js"></script>
<script src="js/cat.js"></script>
</aside>
</body>
<script src="js/index.js"></script>
<script src="js/flavors.js"></script>
<script src="js/cat.js"></script>
</html>
</html>