mirror of
https://github.com/midou36o/midou36o.github.io
synced 2024-11-08 16:02:22 +05:30
Another commit at 2AM this time coming up
This commit is contained in:
parent
8c4229fb07
commit
5e756dcc7b
GPG Key ID:
08063D5407090BC2
@ -27,10 +27,15 @@
|
||||
"svelte": "^3.54.0",
|
||||
"svelte-check": "^3.0.1",
|
||||
"svelte-dark-mode": "^2.1.0",
|
||||
"svelte-time": "^0.7.1",
|
||||
"tslib": "^2.4.1",
|
||||
"typescript": "^4.9.3",
|
||||
"unocss": "^0.48.4",
|
||||
"vite": "^4.0.0"
|
||||
},
|
||||
"type": "module"
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@unocss/reset": "^0.48.4",
|
||||
"dayjs": "^1.11.7"
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
import "uno.css";
|
||||
import "$lib/style.css";
|
||||
import Foote from "$lib/foote.svelte";
|
||||
import "@unocss/reset/tailwind.css";
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
@ -3,14 +3,14 @@
|
||||
import Navi from '$lib/navi.svelte';
|
||||
</script>
|
||||
<Navi/>
|
||||
<body class="dark:bg-black bg-gray-300 font-sans" id="content">
|
||||
<div class="center">
|
||||
<div class="justify-center flex items-center h-screen">
|
||||
<div class="wrapper">
|
||||
<div class="text-black dark:text-white"><h1>{data.name}</h1></div>
|
||||
<div class="text-black dark:text-white"><p id="para" style="margin-top: -15px;">{@html data.description}</p></div>
|
||||
<body class="dark:bg-black bg-gray-300 font-sans min-h-screen" id="content">
|
||||
<div class="text-center">
|
||||
<div class="justify-center flex items-center m-auto shrink overflow-hidden h-screen">
|
||||
<div class="items-center justify-center">
|
||||
<div class="text-black dark:text-white text-4xl"><h1>{data.name}</h1></div>
|
||||
<div class="text-black dark:text-white my-3"><p id="" style="margin-top: -15px;">{@html data.description}</p></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 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>
|
||||
|
||||
@ -1,12 +1,41 @@
|
||||
<script>
|
||||
import {blur} from 'svelte/transition';
|
||||
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>
|
||||
|
||||
<Navi/>
|
||||
<div class="bg-fixed " style="background-image: url($static/images/BG_FHD_darker_mb.png)">
|
||||
<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="i-zondicons-information-solid text-stone-700 dark:text-stone-400 text-4xl" ></div>
|
||||
<h1 class="dark:text-stone-400 text-stone-700 justify-center hover:text-stone" style="">About</h1>
|
||||
<div class="min-h-screen">
|
||||
<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="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 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>
|
||||
@ -1,5 +1,22 @@
|
||||
<script>
|
||||
import Navi from '$lib/navi.svelte';
|
||||
import proj from '$lib/project.json';
|
||||
</script>
|
||||
<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>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 515 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 367 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 194 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 56 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 244 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 242 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 234 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 222 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 206 KiB |
@ -1,14 +1,19 @@
|
||||
import { sveltekit } from '@sveltejs/kit/vite';
|
||||
import type { UserConfig } from 'vite';
|
||||
import { defineConfig } from "vite";
|
||||
import UnoCSS from 'unocss/vite';
|
||||
import presetIcons from '@unocss/preset-icons';
|
||||
import presetWebFonts from '@unocss/preset-web-fonts'
|
||||
|
||||
|
||||
|
||||
const config: UserConfig = {
|
||||
plugins: [sveltekit(), UnoCSS(),
|
||||
/* Self note: Don't add a config between the (), it just overrides the external config. */
|
||||
|
||||
]
|
||||
],
|
||||
optimizeDeps: {
|
||||
include: ["dayjs/plugin/relativeTime.js"],
|
||||
},
|
||||
};
|
||||
|
||||
export default config;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user