artie/artie.moe
1
0
Fork 0
mirror of https://github.com/artiemis/artie.moe.git synced 2026-02-14 09:01:55 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

styles

Browse Source
This commit is contained in:
artie 2024-10-27 14:47:58 +01:00
parent fc5e55278a
commit 54dba567df
8 changed files with 4174 additions and 3590 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
package.json
View File

@ -10,16 +10,15 @@
"astro": "astro" "astro": "astro"
}, },
"dependencies": { "dependencies": {
"@astrojs/svelte": "^5.0.3", "@astrojs/svelte": "^5.7.2",
"@astrojs/tailwind": "^5.1.0", "@astrojs/tailwind": "^5.1.2",
"@iconify-json/mdi": "^1.1.64", "@iconify-json/simple-icons": "^1.2.9",
"@iconify-json/simple-icons": "^1.1.87", "astro": "^4.16.7",
"astro": "^4.1.2", "astro-icon": "^1.1.1",
"astro-icon": "^1.0.2",
"pixi-live2d-display": "^0.4.0", "pixi-live2d-display": "^0.4.0",
"pixi.js": "^6.5.10", "pixi.js": "^6.5.10",
"svelte": "^4.2.8", "svelte": "^4.2.19",
"tailwindcss": "^3.4.1" "tailwindcss": "^3.4.14"
}, },
"devDependencies": { "devDependencies": {
"@catppuccin/tailwindcss": "^0.1.6" "@catppuccin/tailwindcss": "^0.1.6"

7667
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

BIN
src/assets/blobheart.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 10 KiB

BIN
src/assets/maomao.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

11
src/components/Centerpiece.astro
View File

@ -1,12 +1,12 @@
--- ---
import blobHeart from "../assets/blobheart.png"; import maomao from "../assets/maomao.webp";
--- ---
<div class="text-center"> <div class="text-center">
<h1 <h1
class="group text-ctp-pink font-semibold lg:text-5xl text-4xl hover:scale-110 transition duration-50" class="group text-ctp-green font-semibold lg:text-5xl text-4xl hover:scale-110 transition duration-50"
> >
hiya, I'm <span class="text-ctp-red relative" hiya, I'm <span class="text-ctp-teal relative"
>artie<span >artie<span
class="absolute lg:bottom-[3.25rem] bottom-10 z-50 lg:text-xl text-lg lg:left-7 left-4 text-ctp-lavender opacity-0 group-hover:opacity-80 hover:opacity-50 transition duration-50" class="absolute lg:bottom-[3.25rem] bottom-10 z-50 lg:text-xl text-lg lg:left-7 left-4 text-ctp-lavender opacity-0 group-hover:opacity-80 hover:opacity-50 transition duration-50"
>/ˈarti/</span >/ˈarti/</span
@ -14,9 +14,8 @@ import blobHeart from "../assets/blobheart.png";
> >
{" "} {" "}
<img <img
class="align-top lg:w-12 w-10 inline-block pointer-events-none select-none" class="align-top mt-[-4px] rounded-b-md lg:w-12 w-10 inline-block pointer-events-none select-none"
src={blobHeart.src} src={maomao.src}
alt="blob heart"
/> />
</h1> </h1>
<p <p

14
src/components/Icons.astro
View File

@ -4,14 +4,14 @@ import { Icon } from "astro-icon/components";
<div class="flex flex-wrap justify-center gap-x-3 lg:mt-6 mt-5"> <div class="flex flex-wrap justify-center gap-x-3 lg:mt-6 mt-5">
<a href="https://github.com/artiemis" target="_blank"> <a href="https://github.com/artiemis" target="_blank">
<Icon name="mdi:github" /> <Icon name="simple-icons:github" />
</a> </a>
<a <a
class="group relative" class="group relative"
href="https://discord.com/users/134306884617371648" href="https://discord.com/users/134306884617371648"
target="_blank" target="_blank"
> >
<Icon class="hover:text-[#5865F2]" name="mdi:discord" /> <Icon class="hover:text-[#5865F2]" name="simple-icons:discord" />
<div <div
class="absolute xl:w-[28rem] top-10 left-8 z-10 xl:group-hover:opacity-100 transition-opacity opacity-0 pointer-events-none" class="absolute xl:w-[28rem] top-10 left-8 z-10 xl:group-hover:opacity-100 transition-opacity opacity-0 pointer-events-none"
> >
@ -22,15 +22,15 @@ import { Icon } from "astro-icon/components";
/> />
</div> </div>
</a> </a>
<a rel="me" href="https://infosec.exchange/@artie" target="_blank"> <a href="https://bsky.app/profile/artie.moe" target="_blank">
<Icon <Icon
class="hover:text-[#6364FF]" class="hover:text-[#1084fe]"
title="@artie@infosec.exchange" title="@artie.moe"
name="mdi:mastodon" name="simple-icons:bluesky"
/> />
</a> </a>
<a href="https://twitter.com/artiebun" target="_blank"> <a href="https://twitter.com/artiebun" target="_blank">
<Icon class="hover:text-[#1DA1F2]" name="mdi:twitter" /> <Icon class="hover:text-[#1DA1F2]" name="simple-icons:twitter" />
</a> </a>
<a href="https://anilist.co/user/artie" target="_blank"> <a href="https://anilist.co/user/artie" target="_blank">
<Icon class="hover:text-[#02A9FF]" name="simple-icons:anilist" /> <Icon class="hover:text-[#02A9FF]" name="simple-icons:anilist" />

55
src/components/Prompt.astro
View File

@ -1,31 +1,32 @@
<div class="artie font-mono fixed top-4 left-6 text-xl font-bold text-slate-300"> <div
&gt; <span class="text-ctp-pink">art</span>ie class="artie font-mono fixed top-4 left-6 text-xl font-bold text-slate-300"
>
&gt; <span class="text-ctp-sapphire">art</span>ie
</div> </div>
<style> <style>
.artie::after { .artie::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 2.4px; top: 2.4px;
right: -8px; right: -8px;
display: inline-block; display: inline-block;
background-color: #585b70; background-color: #585b70;
vertical-align: top; vertical-align: top;
width: 6px; width: 6px;
height: 22px; height: 22px;
animation: blink 1s step-end infinite; animation: blink 1s step-end infinite;
}
@keyframes blink {
0% {
opacity: 1;
} }
50% {
@keyframes blink { opacity: 0;
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
} }
</style> 100% {
opacity: 1;
}
}
</style>

2
src/pages/index.astro
View File

@ -13,5 +13,5 @@ import Model from "../components/Model.svelte";
<script is:inline src="/vendors/live2dcubismcore.min.js"></script> <script is:inline src="/vendors/live2dcubismcore.min.js"></script>
<script is:inline src="/vendors/live2d.min.js"></script> <script is:inline src="/vendors/live2d.min.js"></script>
<Model client:only /> <Model client:only="svelte" />
</Layout> </Layout>