midou/midou36o.github.io
1
0
Fork 0
mirror of https://github.com/midou36o/midou36o.github.io synced 2024-11-08 18:22:23 +05:30
Code Actions Packages Projects Releases Activity

Another commit at 2AM this time coming up

Browse Source
This commit is contained in:
Midou36O 2023-01-26 02:11:05 +01:00
parent 8c4229fb07
commit 5e756dcc7b
Signed by: midou
GPG Key ID: 08063D5407090BC2
15 changed files with 73 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
package.json
View File

@ -27,10 +27,15 @@
"svelte": "^3.54.0", "svelte": "^3.54.0",
"svelte-check": "^3.0.1", "svelte-check": "^3.0.1",
"svelte-dark-mode": "^2.1.0", "svelte-dark-mode": "^2.1.0",
"svelte-time": "^0.7.1",
"tslib": "^2.4.1", "tslib": "^2.4.1",
"typescript": "^4.9.3", "typescript": "^4.9.3",
"unocss": "^0.48.4", "unocss": "^0.48.4",
"vite": "^4.0.0" "vite": "^4.0.0"
}, },
"type": "module" "type": "module",
"dependencies": {
"@unocss/reset": "^0.48.4",
"dayjs": "^1.11.7"
}
} }

1
src/routes/+layout.svelte
View File

@ -2,6 +2,7 @@
import "uno.css"; import "uno.css";
import "$lib/style.css"; import "$lib/style.css";
import Foote from "$lib/foote.svelte"; import Foote from "$lib/foote.svelte";
import "@unocss/reset/tailwind.css";
</script> </script>
<style> <style>

14
src/routes/+page.svelte
View File

@ -3,14 +3,14 @@
import Navi from '$lib/navi.svelte'; import Navi from '$lib/navi.svelte';
</script> </script>
<Navi/> <Navi/>
<body class="dark:bg-black bg-gray-300 font-sans" id="content"> <body class="dark:bg-black bg-gray-300 font-sans min-h-screen" id="content">
<div class="center"> <div class="text-center">
<div class="justify-center flex items-center h-screen"> <div class="justify-center flex items-center m-auto shrink overflow-hidden h-screen">
<div class="wrapper"> <div class="items-center justify-center">
<div class="text-black dark:text-white"><h1>{data.name}</h1></div> <div class="text-black dark:text-white text-4xl"><h1>{data.name}</h1></div>
<div class="text-black dark:text-white"><p id="para" style="margin-top: -15px;">{@html data.description}</p></div> <div class="text-black dark:text-white my-3"><p id="" style="margin-top: -15px;">{@html data.description}</p></div>
<div> <div>
<hr class="text-black bg-black dark:bg-white dark:text-white" style="width:60%;text-align:center;"/> <hr class="text-black bg-black dark:bg-white dark:text-white text-center justify-center m-auto my-2" style="width:60%;text-align:center;"/>
</div> </div>
<div class="justify-center flex flex-row items-center gap-3 text-3xl hover:text-yellow-500"> <div class="justify-center flex flex-row items-center gap-3 text-3xl hover:text-yellow-500">
<div><a class="text-black dark:text-white i-carbon-logo-github" href="{data.github}{data.gh} " title="Midou's GitHub" >G</a></div> <div><a class="text-black dark:text-white i-carbon-logo-github" href="{data.github}{data.gh} " title="Midou's GitHub" >G</a></div>

39
src/routes/about/+page.svelte
View File

@ -1,12 +1,41 @@
<script> <script>
import {blur} from 'svelte/transition'; import {blur} from 'svelte/transition';
import Navi from '$lib/navi.svelte'; import Navi from '$lib/navi.svelte';
import Time from "svelte-time";
import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";
// DayJS
dayjs.extend(relativeTime);
let yr = dayjs('2004-15-07').fromNow(true);
</script> </script>
<Navi/> <Navi/>
<div class="bg-fixed " style="background-image: url($static/images/BG_FHD_darker_mb.png)"> <div class="min-h-screen">
<div class="flex grid h-screen place-content-center content-center place-items-center gap-3 rounded-2xl mt-0 mx-3 outline outline-offset-1 bg-blue-200 outline-blue-500 dark:outline-indigo-500 dark:bg-indigo-900/50"> <div class="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="i-zondicons-information-solid text-stone-700 dark:text-stone-400 text-4xl" ></div> <div class="flex flex-row gap-2 my-4">
<h1 class="dark:text-stone-400 text-stone-700 justify-center hover:text-stone" style="">About</h1> <div class="i-zondicons-information-solid m-1 text-stone-700 dark:text-indigo-300 text-4xl"></div>
</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 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.
You can call me Midou. Anyway I live in Morocco, I'm {yr} old.
There are a tons of things i've done but you never know what's the point of doing all of this.
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>

19
src/routes/projects/+page.svelte
View File

@ -1,5 +1,22 @@
<script> <script>
import Navi from '$lib/navi.svelte'; import Navi from '$lib/navi.svelte';
import proj from '$lib/project.json';
</script> </script>
<Navi/> <Navi/>
<p>When the page is sus</p> <div class="min-h-screen justify-center grid md:grid-rows-3 xl:grid-cols-2 place-items-center md:my-4 mt-4 gap-3 mx-4 grid-cols-1 ">
{#each proj as { name, date, desc, url, image, imdes }}
<div class="dark:bg-slate-400 bg-slate-600 dark:text-white text-black rounded-lg w-[100-40] md:max-w-xl">
<div class="md:flex">
<div class="md:shrink-0">
<img class="md:rounded-l-lg md:rounded-none rounded-lg md:h-full md:w-45 w-screen object-cover h-48" src="{image}" alt="{imdes}">
</div>
<div class="pb-20 pt-5 px-8 md:py-2 md:px-8 md:rounded-r-lg md:rounded-none rounded-b-lg dark:text-white text-black dark:bg-slate-7 bg-slate-200 md:h-full">
<div><h3 class="text-3xl dark:text-white text-black text-center">{name}</h3></div>
<div class="text-sm dark:text-white text-black text-center">{date}</div>
<div><p class="dark:text-white text-black text-sm">{desc}</p></div>
<div><a class="text-xl bg-sky-5 hover:bg-sky-4 hover:text-white text-white outline-0 hover:shadow-md duration-300 shadow-sky-4/50 px-4 py-1 justify-end m-4 rounded-full float-right" href="{url}">Access the project</a></div>
</div>
</div>
</div>
{/each}
</div>

BIN
static/images/BG_FHD.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 515 KiB

BIN
static/images/BG_FHD_darker.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 367 KiB

BIN
static/images/BG_FHD_darker_mb.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 194 KiB

BIN
static/images/BG_MAX.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 56 MiB

BIN
static/images/OpenGraph.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 244 KiB

BIN
static/images/OpenGraph.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 242 KiB

BIN
static/images/OpenGraphNoTxt.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 234 KiB

BIN
static/images/banner.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 222 KiB

BIN
static/images/small_banner.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 206 KiB

9
vite.config.ts
View File

@ -1,14 +1,19 @@
import { sveltekit } from '@sveltejs/kit/vite'; import { sveltekit } from '@sveltejs/kit/vite';
import type { UserConfig } from 'vite'; import type { UserConfig } from 'vite';
import { defineConfig } from "vite";
import UnoCSS from 'unocss/vite'; import UnoCSS from 'unocss/vite';
import presetIcons from '@unocss/preset-icons'; import presetIcons from '@unocss/preset-icons';
import presetWebFonts from '@unocss/preset-web-fonts' import presetWebFonts from '@unocss/preset-web-fonts'
const config: UserConfig = { const config: UserConfig = {
plugins: [sveltekit(), UnoCSS(), plugins: [sveltekit(), UnoCSS(),
/* Self note: Don't add a config between the (), it just overrides the external config. */ /* Self note: Don't add a config between the (), it just overrides the external config. */
],
] optimizeDeps: {
include: ["dayjs/plugin/relativeTime.js"],
},
}; };
export default config; export default config;