mirror of
https://github.com/midou36o/midou36o.github.io
synced 2024-11-08 16:02:22 +05:30
Do not commit at 3am (gone wrong)
This commit is contained in:
parent
557a7f8239
commit
a3bae60b88
GPG Key ID:
1D134A95FE521A7A
@ -5,34 +5,34 @@
|
||||
</script>
|
||||
|
||||
<body class="text-black dark:text-white dark:bg-black bg-gray-300 font-sans" id="content">
|
||||
<div class="justify-center flex md:flex-row flex-col items-center m-auto shrink overflow-hidden h-screen">
|
||||
<div class="justify-center flex md:flex-row flex-col items-center m-auto shrink overflow-hidden h-25% md:h-screen">
|
||||
<!-- Primary content (left) -->
|
||||
<div in:fly={{ delay: 300, duration: 300, y: 50, easing: quintOut}} animate=true out:fly={{ duration: 300, y: -50, easing: quintOut}} class="text-center">
|
||||
<div class="justify-center flex flex-col items-center m-auto shrink overflow-hidden h-screen">
|
||||
<div in:fly={{ delay: 300, duration: 300, y: 50, easing: quintOut}} out:fly={{ delay: 100, duration: 200, y: 0, easing: quintOut}} class="text-center">
|
||||
<div class="justify-center flex flex-col items-center m-auto shrink overflow-hidden md:pb-0 md:pt-0 pb-10% pt-110% h-1/2 md:h-screen">
|
||||
<div in:fly={{ delay: 300, duration: 300, x: 50, easing: quintOut}} animate=true out:fly={{ duration: 300, x: -50, easing: quintOut}} >
|
||||
<h1 class="text-black dark:text-white text-4xl">{data.name}</h1>
|
||||
<p class="text-black dark:text-white pb-5" style="">{@html data.description}</p>
|
||||
</div>
|
||||
<hr transition:fly={{ duration: 300, x: 0, easing: quintOut}} class="border-black w-100%"/>
|
||||
<div in:fly={{ delay: 300, duration: 300, x: -50, easing: quintOut}} out:fly={{ duration: 300, x: 50, easing: quintOut}} >
|
||||
<hr transition:fly={{ duration: 300, x: 0, easing: quintOut}} class="border-black dark:border-white w-100%"/>
|
||||
<div in:fly={{ delay: 300, duration: 300, x: -50, easing: quintOut}} out:fly={{ duration: 300, x: 50, easing: quintOut}} class="flex md:flex-col flex-row px-3 md:px-0" >
|
||||
<a href="{data.github}{data.gh}">
|
||||
<div class="flex flex-row py-1">
|
||||
<div class="i-carbon-logo-github text-black text-3xl"></div><p class="text-1xl text-black pl-2">GitHub</p>
|
||||
<div class="i-carbon-logo-github text-black dark:text-white px-2 md:px-0 text-3xl"></div><p class="text-1xl md:block hidden dark:text-white text-black md:pl-2">GitHub</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="{data.matrix}{data.mtx}">
|
||||
<div class="flex flex-row py-1">
|
||||
<div class="i-tabler-brand-matrix pl-3 text-black text-3xl"></div><p class="text-1xl text-black pl-2">Matrix</p>
|
||||
<div class="i-tabler-brand-matrix md:pl-3 text-black dark:text-white px-2 md:px-0 text-3xl"></div><p class="text-1xl md:block hidden dark:text-white text-black md:pl-2">Matrix</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="mailto:{data.mail}">
|
||||
<div class="flex flex-row py-1">
|
||||
<div class="i-mdi-at pl-3 text-black text-3xl"></div><p class="text-1xl text-black pl-2">Mail</p>
|
||||
<div class="i-mdi-at md:pl-3 text-black dark:text-white px-2 md:px-0 text-3xl"></div><p class="text-1xl md:block hidden text-black dark:text-white md:pl-2">Mail</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="/donate">
|
||||
<div class="flex flex-row py-1">
|
||||
<div class="i-ph-currency-circle-dollar-bold pl-3 text-black text-3xl"></div><p class="text-1xl text-black pl-2">Donate</p>
|
||||
<div class="i-ph-currency-circle-dollar-bold md:pl-3 text-black px-2 md:px-0 dark:text-white text-3xl"></div><p class="text-1xl md:block hidden text-black dark:text-white md:pl-2">Donate</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@ -40,11 +40,26 @@
|
||||
</div>
|
||||
<!-- vertical line -->
|
||||
<div
|
||||
in:fly={{ delay: 300, duration: 300, y: 0, easing: quintOut}}
|
||||
out:fly={{ duration: 300, y: 0, easing: quintOut}}
|
||||
class="md:mx-4 md:h-1/2 md:w-1 w-3/4 border-1 bg-black border-black rounded-md"
|
||||
in:fly={{ delay: 300, duration: 300, y: 0, easing: quintOut}}
|
||||
out:fly={{ duration: 300, y: 0, easing: quintOut}}
|
||||
class="md:mx-4 md:h-1/4 md:w-1 w-3/4 border-1 bg-black border-black dark:border-white dark:bg-white rounded-md hidden md:block"
|
||||
></div>
|
||||
<!-- Secondary content (right) -->
|
||||
<div class="i-gridicons-info text-4xl"></div><h2 class="text-4xl">About</h2>
|
||||
</div>
|
||||
<div class="flex md:flex-col flex-row px-5 md:px-0 ">
|
||||
<div in:fly={{ delay: 300, duration: 300, x: -20, easing: quintOut}}
|
||||
out:fly={{ delay: 50, duration: 250, y: 0, easing: quintOut}}
|
||||
class="flex flex-row">
|
||||
<a href="/about"><div class="flex flex-row"><div class="i-gridicons-info text-5xl md:text-4xl"></div><h2 class="md:pl-2 text-4xl hidden md:block">About</h2></div></a>
|
||||
</div>
|
||||
<div in:fly={{ delay: 350, duration: 300, x: -20, easing: quintOut}}
|
||||
out:fly={{ delay: 100, duration: 200, y: 0, easing: quintOut}}
|
||||
class="flex flex-row">
|
||||
<a href="/projects"><div class="flex flex-row"><div class="i-octicon-project-16 text-5xl md:text-4xl"></div><h2 class="md:pl-2 text-4xl hidden md:block">Projects</h2></div></a>
|
||||
</div>
|
||||
<div in:fly={{ delay: 400, duration: 300, x: -20, easing: quintOut}}
|
||||
out:fly={{ delay: 150, duration: 150, y: 0, easing: quintOut}}
|
||||
class="flex flex-row">
|
||||
<a href="/blog"><div class="flex flex-row"><div class="i-ph-book-bold text-5xl md:text-4xl"></div><h2 class="md:pl-2 text-4xl hidden md:block">Blog</h2></div></a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
@ -3,26 +3,15 @@
|
||||
import relativeTime from "dayjs/plugin/relativeTime";
|
||||
// DayJS
|
||||
dayjs.extend(relativeTime);
|
||||
let yr = dayjs('2004-15-07').fromNow(true);
|
||||
let yr = dayjs('2004-07-15').fromNow(true);
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<div class="min-h-screen">
|
||||
<div class="mt-70px md:mt-100px flex place-content-center content-center place-items-center gap-3 rounded-2xl mx-7 md:mx-30 my-6 outline outline-offset-0 bg-blue-200 outline-blue-500 dark:outline-indigo-500 dark:bg-indigo-900/50">
|
||||
<div class="flex flex-row gap-2 my-4">
|
||||
<div class="i-zondicons-information-solid m-1 text-stone-700 dark:text-indigo-300 text-4xl"></div>
|
||||
<h1 class="text-stone-700 dark:text-indigo-400 text-4xl">About</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center content-center items-center flex flex-col md:inline-flex justify-center place-items-center md:text-left">
|
||||
<div class="flex flex-row gap-3 md:pl-30">
|
||||
<div class="i-mdi-head-question-outline text-black dark:text-white text-5xl">Head</div>
|
||||
<h2 class="text-5xl text-black dark:text-white ">Who i am</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-xl pt-2 px-5 md:px-40 md:text-left mb-50px text-black dark:text-white ">
|
||||
<div class="justify-center flex flex-col items-center m-auto shrink overflow-hidden h-screen ">
|
||||
<div class="text-xl pt-2 px-5 md:px-40 text-center md:text-left mb-50px text-black dark:text-white ">
|
||||
<p>I'm a passionate programmer who has nothing to do with his life other than to just live in front of a computer and that's it.
|
||||
However i also have other passions and such.
|
||||
Well this is just temporary, don't really expect me to add something useful in it.
|
||||
@ -31,7 +20,7 @@
|
||||
Hey are you listening? This is serious. No i really mean it's actually serious.
|
||||
I'm trying to extend this enough to see if it works or not, because for some reason HTML loves stopping at a point without styling the BG.
|
||||
Anyway how's it going? Lore ipsum bullshit yadda yadda yadda. Did you know that project + is actually nice? No? Too bad.
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -10,16 +10,16 @@
|
||||
<h1 class="text-black dark:text-white text-4xl">Donate</h1>
|
||||
<p class="text-black dark:text-white pb-5" style="">Thanks a lot!</p>
|
||||
</div>
|
||||
<hr transition:fly={{ duration: 300, x: 0, easing: quintOut}} class="border-black w-1/6"/>
|
||||
<hr transition:fly={{ duration: 300, x: 0, easing: quintOut}} class="border-black dark:border-white w-1/6"/>
|
||||
<div in:fly={{ delay: 300, duration: 300, x: -50, easing: quintOut}} out:fly={{ duration: 300, x: 50, easing: quintOut}} >
|
||||
<a href="https://github.com/sponsors/midou36o">
|
||||
<div class="flex flex-row pt-5">
|
||||
<div class="i-carbon-logo-github text-black text-2xl"></div><p class="text-1xl text-black pl-2">GitHub Sponsors</p>
|
||||
<div class="i-carbon-logo-github dark:text-white text-black text-2xl"></div><p class="text-1xl text-black dark:text-white pl-2">GitHub Sponsors</p>
|
||||
</div>
|
||||
</a>
|
||||
<a href="/donate/monero">
|
||||
<div class="flex flex-row">
|
||||
<div class="i-tabler-coin-monero pl-3 text-black text-2xl"></div><p class="text-1xl text-black pl-2">Monero</p>
|
||||
<div class="i-tabler-coin-monero pl-3 text-black dark:text-white text-2xl"></div><p class="text-1xl text-black dark:text-white pl-2">Monero</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -16,10 +16,12 @@
|
||||
out:fly={{ duration: 300, y: 50, easing: quintOut}}
|
||||
class="text-black dark:text-white text-4xl md:pr-2"
|
||||
>Monero</h1>
|
||||
<p class="md:hidden block text-gray-500"> I fucking hate css </p>
|
||||
<!-- Vertical line -->
|
||||
<div
|
||||
in:fly={{ delay: 300, duration: 300, y: 0, easing: quintOut}}
|
||||
out:fly={{ duration: 300, y: 0, easing: quintOut}}
|
||||
class="md:h-1/2 md:w-1 w-3/4 border-1 bg-black border-black rounded-md"
|
||||
class="md:h-1/2 md:w-1 w-3/4 border-1 bg-black border-black dark:bg-white dark:border-white rounded-md"
|
||||
></div>
|
||||
<div
|
||||
in:fly={{ delay: 300, duration: 300, y: 50, easing: quintOut}}
|
||||
@ -31,5 +33,5 @@
|
||||
<h1 class="underline-offset-auto hover:underline text-3xl"><a href="monero:44UzWvWS9wELmqPXzLqiPphXVYBbsjkbC7r4RwCSoXC4UyzC2NbPEoPEjxZsGVfbSPbAHUGtpc8GUYUZ8fdu1a4bNAyBPDe"> Monero wallet:</a></h1>
|
||||
<p><code class="break-all">44UzWvWS9wELmqPXzLqiPphXVYBbsjkbC7r4RwCSoXC4UyzC2NbPEoPEjxZsGVfbSPbAHUGtpc8GUYUZ8fdu1a4bNAyBPDe</code></p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
111
unocss.config.ts
111
unocss.config.ts
@ -6,9 +6,9 @@ import {
|
||||
transformerDirectives,
|
||||
presetWind,
|
||||
presetWebFonts
|
||||
} from "unocss";
|
||||
} from 'unocss';
|
||||
|
||||
import { extractorSvelte } from "unocss";
|
||||
import { extractorSvelte } from 'unocss';
|
||||
|
||||
export default defineConfig({
|
||||
extractors: [extractorSvelte],
|
||||
@ -17,114 +17,53 @@ export default defineConfig({
|
||||
presetIcons(),
|
||||
presetTypography({
|
||||
cssExtend: {
|
||||
"h1,h2,h3,h4,h5,h6": {
|
||||
"font-weight": "800"
|
||||
'h1,h2,h3,h4,h5,h6': {
|
||||
'font-weight': '800'
|
||||
}
|
||||
}
|
||||
}),
|
||||
presetWind({
|
||||
dark: "class"
|
||||
/* dark: "class" */
|
||||
/* use dark: "class" when adding manual JS*/
|
||||
}),
|
||||
presetWebFonts({
|
||||
provider: 'bunny',
|
||||
fonts: {
|
||||
sans: ['Outfit', 'Comic Sans MS'],
|
||||
mono: ['Fira Code'],
|
||||
|
||||
}
|
||||
mono: ['Fira Code']
|
||||
}
|
||||
})
|
||||
],
|
||||
|
||||
theme: {
|
||||
fontFamily: {
|
||||
primary: ["var(--font-primary)"]
|
||||
primary: ['var(--font-primary)']
|
||||
},
|
||||
margin: {
|
||||
"0-auto": "0 auto"
|
||||
'0-auto': '0 auto'
|
||||
},
|
||||
colors: {
|
||||
accent: "var(--accent)",
|
||||
accentTranslucent: "var(--accent-translucent)",
|
||||
primary: "var(--primary)",
|
||||
secondary: "var(--secondary)",
|
||||
tertiary: "var(--tertiary)",
|
||||
text: "var(--text)",
|
||||
grey: "var(--grey)",
|
||||
alt: "var(--alt)",
|
||||
altText: "var(--alt-text)"
|
||||
accent: 'var(--accent)',
|
||||
accentTranslucent: 'var(--accent-translucent)',
|
||||
primary: 'var(--primary)',
|
||||
secondary: 'var(--secondary)',
|
||||
tertiary: 'var(--tertiary)',
|
||||
text: 'var(--text)',
|
||||
grey: 'var(--grey)',
|
||||
alt: 'var(--alt)',
|
||||
altText: 'var(--alt-text)'
|
||||
},
|
||||
breakpoints: {
|
||||
sm: "640px",
|
||||
md: "768px",
|
||||
lg: "1024px",
|
||||
xl: "1280px",
|
||||
"2xl": "1536px",
|
||||
nav: "1030px"
|
||||
sm: '640px',
|
||||
md: '768px',
|
||||
lg: '1024px',
|
||||
xl: '1280px',
|
||||
'2xl': '1536px',
|
||||
nav: '1030px'
|
||||
}
|
||||
},
|
||||
|
||||
transformers: [transformerVariantGroup(), transformerDirectives()],
|
||||
|
||||
safelist: ["i-ic:outline-dark-mode", "i-ic:outline-light-mode"]
|
||||
safelist: ['i-ic:outline-dark-mode', 'i-ic:outline-light-mode']
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user