Merge Next into Master #1
@ -4,7 +4,20 @@
|
|||||||
import ThemeToggle from "../misc/ThemeToggle.astro";
|
import ThemeToggle from "../misc/ThemeToggle.astro";
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="fixed top-0 left-0 w-72 h-screen p-4 flex flex-col bg-base-200">
|
<style>
|
||||||
|
[data-shown="true"] {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div id="menu" data-shown=""
|
||||||
|
class="fixed top-0 left-0 w-72 h-screen p-4 flex flex-col bg-base-200 sm:-translate-x-full md:-translate-x-full lg:translate-x-0 xl:translate-x-0 2xl: translate-x-0 transition-all duration-100 z-50">
|
||||||
|
|
||||||
|
<button id="menu-close" class="absolute top-0 right-0 p-2 lg:hidden 2xl:hidden">
|
||||||
|
<span class="material-symbols-outlined">
|
||||||
|
close
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
<a href="/">
|
<a href="/">
|
||||||
<div class="transition ease-in-out w-1/2 hover:scale-105 block mx-auto mt-3 mb-6">
|
<div class="transition ease-in-out w-1/2 hover:scale-105 block mx-auto mt-3 mb-6">
|
||||||
@ -40,7 +53,8 @@
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="flex">
|
<li class="flex">
|
||||||
<a href="mailto:thomas.patrick.cole@gmail.com" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
<a href="mailto:thomas.patrick.cole@gmail.com"
|
||||||
|
class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
||||||
<button class="p-2">Contact</button>
|
<button class="p-2">Contact</button>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
@ -49,3 +63,28 @@
|
|||||||
<Divider />
|
<Divider />
|
||||||
<ThemeToggle />
|
<ThemeToggle />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="hidden h-12 w-full sm:block md:block lg:hidden xl:hidden 2xl:hidden bg-base-200 text-left transition-all duration-100">
|
||||||
|
|
||||||
|
<button id="menubtn" class="w-12 h-12 m-auto">
|
||||||
|
<span class="material-symbols-outlined mt-1">
|
||||||
|
menu
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script is:inline>
|
||||||
|
const btn = document.getElementById("menubtn");
|
||||||
|
const menu = document.getElementById("menu");
|
||||||
|
const closebtn = document.getElementById("menu-close")
|
||||||
|
|
||||||
|
btn.addEventListener('click', () => {
|
||||||
|
menu.dataset.shown = "true";
|
||||||
|
});
|
||||||
|
|
||||||
|
closebtn.addEventListener('click', () => {
|
||||||
|
menu.dataset.shown = "false";
|
||||||
|
})
|
||||||
|
</script>
|
@ -6,7 +6,7 @@ const { frontmatter } = Astro.props;
|
|||||||
---
|
---
|
||||||
|
|
||||||
<Layout>
|
<Layout>
|
||||||
<main class="w-1/2 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center">
|
<main class="w-1/2 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center">
|
||||||
<img class="aspect-video object-cover mb-4" src={frontmatter.image} alt="">
|
<img class="aspect-video object-cover mb-4" src={frontmatter.image} alt="">
|
||||||
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
||||||
<p>{frontmatter.date}</p>
|
<p>{frontmatter.date}</p>
|
||||||
|
@ -6,7 +6,7 @@ const { frontmatter } = Astro.props;
|
|||||||
---
|
---
|
||||||
|
|
||||||
<Layout>
|
<Layout>
|
||||||
<main class="w-1/2 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center">
|
<main class="w-1/2 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center">
|
||||||
<img class="aspect-video object-cover mb-4" src={frontmatter.image} alt="">
|
<img class="aspect-video object-cover mb-4" src={frontmatter.image} alt="">
|
||||||
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
||||||
<p>{frontmatter.date}</p>
|
<p>{frontmatter.date}</p>
|
||||||
|
@ -50,7 +50,7 @@
|
|||||||
|
|
||||||
<body class="">
|
<body class="">
|
||||||
<Nav />
|
<Nav />
|
||||||
<div class="ml-72">
|
<div class="ml-72 sm:ml-0 md:ml-0 lg:ml-72 xl:ml-72 2xl:ml-72">
|
||||||
<slot />
|
<slot />
|
||||||
<Footer/>
|
<Footer/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -17,7 +17,7 @@
|
|||||||
---
|
---
|
||||||
|
|
||||||
<Layout title=" | Blog">
|
<Layout title=" | Blog">
|
||||||
<main class="w-1/2 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4">
|
<main class="w-1/2 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4">
|
||||||
<div class="flex flex-col">
|
<div class="flex flex-col">
|
||||||
{
|
{
|
||||||
page.data.map((post: any) => (
|
page.data.map((post: any) => (
|
||||||
|
@ -18,7 +18,7 @@ const projects = (await Astro.glob("./projects/*.{md,mdx}")).sort(
|
|||||||
---
|
---
|
||||||
|
|
||||||
<Layout>
|
<Layout>
|
||||||
<main class="flex flex-col m-6 w-1/2 mx-auto md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2">
|
<main class="flex flex-col m-6 w-1/2 mx-auto sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2">
|
||||||
<section>
|
<section>
|
||||||
<p class="text-xl py-1">Hello World 👋</p>
|
<p class="text-xl py-1">Hello World 👋</p>
|
||||||
<p>I'm glad you are here!</p>
|
<p>I'm glad you are here!</p>
|
||||||
|
@ -17,7 +17,7 @@
|
|||||||
---
|
---
|
||||||
|
|
||||||
<Layout title=" | Blog">
|
<Layout title=" | Blog">
|
||||||
<main class="w-1/2 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4">
|
<main class="w-1/2 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4">
|
||||||
<div class="flex flex-col">
|
<div class="flex flex-col">
|
||||||
{
|
{
|
||||||
page.data.map((post: any) => (
|
page.data.map((post: any) => (
|
||||||
|
@ -22,7 +22,15 @@
|
|||||||
p5.shuffle(data, true)
|
p5.shuffle(data, true)
|
||||||
quicksort(data, 0, data.length-1);
|
quicksort(data, 0, data.length-1);
|
||||||
animArray.push(new arrayFrame(data.toString(), null, null, null));
|
animArray.push(new arrayFrame(data.toString(), null, null, null));
|
||||||
p5.createCanvas(850,400)
|
|
||||||
|
//setup the canvas
|
||||||
|
let div = p5.createDiv('');
|
||||||
|
div.addClass('w-full');
|
||||||
|
div.addClass('mx-auto');
|
||||||
|
div.addClass('flex');
|
||||||
|
div.addClass('place-content-center');
|
||||||
|
let canvas = p5.createCanvas(600,400);
|
||||||
|
canvas.parent(div);
|
||||||
p5.frameRate(30);
|
p5.frameRate(30);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -143,7 +151,7 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<P5 {sketch}/>
|
<P5 {sketch}/>
|
||||||
<div class="flex justify-evenly">
|
<div class="flex justify-evenly mt-6">
|
||||||
<button on:click={prevFrame}>Prev Frame</button>
|
<button on:click={prevFrame}>Prev Frame</button>
|
||||||
<button on:click={()=>(playpause = !playpause)}>
|
<button on:click={()=>(playpause = !playpause)}>
|
||||||
{#if playpause}
|
{#if playpause}
|
||||||
|
@ -12,7 +12,7 @@
|
|||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<main class="w-1/2 mx-auto md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2">
|
<main class="w-1/2 mx-auto sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2">
|
||||||
<p class="font-bold text-2xl py-6">About Me</p>
|
<p class="font-bold text-2xl py-6">About Me</p>
|
||||||
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus esse inventore iusto earum asperiores necessitatibus, dolores id cumque nesciunt libero eligendi vel reprehenderit eius officia. Veritatis dolorum illum exercitationem suscipit.</p>
|
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Possimus esse inventore iusto earum asperiores necessitatibus, dolores id cumque nesciunt libero eligendi vel reprehenderit eius officia. Veritatis dolorum illum exercitationem suscipit.</p>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user