Fluffy/website
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/website.git synced 2024-12-28 18:36:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Yeet custom images for blogs and posts and stuff, because I dont wanna loose all my hair FUCK

Browse source 
Clean up examples that I need to work with
Remove un-needed code bluh
Leg
This commit is contained in:
Michał 2024-05-26 18:29:33 +01:00
parent 457591297a
commit 09c53ed7ac
21 changed files with 56 additions and 135 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
src/assets/banner-alt.webp
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 12 MiB

BIN
src/assets/banner.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 415 KiB

BIN
src/assets/cupcake.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 322 KiB

0
src/assets/leg.jpg → src/assets/fumble.jpg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 111 KiB

2
src/content/content.ts
View file

@ -7,7 +7,6 @@ const postsCollection = defineCollection({
title: z.string(), title: z.string(),
description: z.string(), description: z.string(),
pubDate: z.date(), pubDate: z.date(),
image: z.string().optional(),
tags: z.array(z.string()), tags: z.array(z.string()),
}), }),
}); });
@ -18,7 +17,6 @@ const projectsCollection = defineCollection({
draft: z.boolean().optional(), draft: z.boolean().optional(),
title: z.string(), title: z.string(),
description: z.string(), description: z.string(),
image: z.string().optional(),
tags: z.array(z.string()), tags: z.array(z.string()),
}), }),
}); });

5
src/content/posts/code-examples.md
View file

@ -2,15 +2,10 @@
title: "Code Examples" title: "Code Examples"
description: "Aurghhhhhh" description: "Aurghhhhhh"
pubDate: 2022-07-08 pubDate: 2022-07-08
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Tennis balls"
tags: tags:
- "Gaybo" - "Gaybo"
--- ---
Penitc
```astro ```astro
--- ---
import { getPosts } from "../../utils"; import { getPosts } from "../../utils";

15
src/content/posts/example.md
View file

@ -1,15 +0,0 @@
---
title: This is an example Post
description: "Blamby ford"
pubDate: 2022-07-08
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Thumbnail of Astro arcs."
tags:
- "GwaGwa"
- "Gaming"
- "Urchin"
- "Fortnite"
---
aurgh

11
src/content/posts/image-examples.md Normal file
View file

@ -0,0 +1,11 @@
---
title: "Image Examples"
description: "fug"
pubDate: 2024-07-08
tags:
- "Faggo"
---
![Image](../../assets/cupcake.jpg)
critter time!!!!

5
src/content/posts/markdown-cheat-sheet.md
View file

@ -1,12 +1,7 @@
--- ---
#draft: true
title: This is an example Post title: This is an example Post
description: "Cheat Sheet for Markdown" description: "Cheat Sheet for Markdown"
pubDate: 2022-07-08 pubDate: 2022-07-08
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Thumbnail of Astro arcs."
tags: tags:
- "Faggor" - "Faggor"
--- ---

14
src/content/projects/example-2.md
View file

@ -1,14 +0,0 @@
---
title: Project 2
description: Another one
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Thumbnail of Astro arcs."
tags:
- "GwaGwa"
- "Gaming"
- "Urchin"
- "Fortnite"
---
AURGH

14
src/content/projects/example.md
View file

@ -1,14 +0,0 @@
---
title: Project 1
description: Example Project Im working on
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Thumbnail of Astro arcs."
tags:
- "GwaGwa"
- "Gaming"
- "Urchin"
- "Fortnite"
---
Gay Balls even

11
src/content/projects/gwagwa.md
View file

@ -1,9 +1,6 @@
--- ---
title: GwaGwa title: GwaGwa
description: :3 description: This astro page
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Thumbnail of Astro arcs."
tags: tags:
- "GwaGwa" - "GwaGwa"
- "Gaming" - "Gaming"
@ -11,4 +8,8 @@ tags:
- "Fortnite" - "Fortnite"
--- ---
gwagwa Im actually going to blow up
I FUCKING HATE JAVASCRIPT

29
src/layouts/Layout.astro
View file

@ -1,7 +1,6 @@
--- ---
import { Picture, getImage } from 'astro:assets';
import "../styles/styles.scss"; import "../styles/styles.scss";
import Banner from "../assets/banner.png";
interface Props { interface Props {
title: string; title: string;
@ -9,14 +8,7 @@ interface Props {
alt: string, alt: string,
} }
const { title, image, alt } = Astro.props; const { title} = Astro.props;
let imageData = await getImage({
src: image,
format: "jpeg",
width: 1080,
height: 700,
});
--- ---
<!doctype html> <!doctype html>
@ -36,15 +28,13 @@ let imageData = await getImage({
</head> </head>
<body> <body>
<div class="banner"> <div class="banner">
<Picture <img
src={imageData.src} src={Banner.src}
alt={alt} alt="Stretch of road leading to cloudy hills with houses in the horizon"
width={1080} width="1080"
height={700} height="700"
widths={[240, 540, 720, 1080]}
sizes={`(max-width: 360px) 240px, (max-width: 720px) 540px, (max-width: 1600px) 720px, 1080px`}
formats={['jpeg', 'webp']}
loading="eager" loading="eager"
decoding="async"
/> />
</div> </div>
<main> <main>
@ -52,9 +42,10 @@ let imageData = await getImage({
</main> </main>
</body> </body>
<script> <script>
const img = document.querySelector(".banner > picture > img") as HTMLImageElement; const img = document.querySelector(".banner > img") as HTMLImageElement;
document.addEventListener("scroll", () => { document.addEventListener("scroll", () => {
img.style.top = `${window.scrollY}px`; img.style.top = `${window.scrollY}px`;
img.style.transform = `scale(${(window.scrollY / 10000) + 1})`;
img.style.filter = `blur(${window.scrollY / 100}px)`; img.style.filter = `blur(${window.scrollY / 100}px)`;
}) })
</script> </script>

31
src/layouts/Markdown.astro
View file

@ -9,8 +9,6 @@ interface Props {
} }
const { post, prev, next, base } = Astro.props; const { post, prev, next, base } = Astro.props;
const { Content } = await post.render();
--- ---
<HomeButton /> <HomeButton />
@ -29,7 +27,7 @@ const { Content } = await post.render();
<div id="markdown"> <div id="markdown">
<div style="margin-bottom: 32px" /> <div style="margin-bottom: 32px" />
<Content /> <slot></slot>
<div style="margin-top: 32px" /> <div style="margin-top: 32px" />
</div> </div>
@ -68,9 +66,6 @@ const { Content } = await post.render();
align-content: center; align-content: center;
> li > .button { > li > .button {
// background-color: transparent;
// padding: 0 16px;
min-width: 35px; min-width: 35px;
height: 35px; height: 35px;
@ -181,22 +176,12 @@ const { Content } = await post.render();
} }
} }
// pre { img {
// padding: 8px; max-width: 100%;
// height: auto;
// white-space: pre-wrap;
// word-wrap: break-word; border-radius: $radius;
// }
// border-radius: $radius;
// background-color: $gray !important;
// color: $light;
//
// overflow-x: scroll;
//
// > code {
// padding: 0;
// }
// }
.astro-code { .astro-code {
margin: 16px 0; margin: 16px 0;
@ -241,7 +226,7 @@ const { Content } = await post.render();
background-color: $gray; background-color: $gray;
> h2 { > h2 {
padding-top: 0; margin-top: 0;
} }
} }
} }

6
src/pages/index.astro
View file

@ -1,13 +1,11 @@
--- ---
import { getCollection } from "astro:content"; import { getCollection } from "astro:content";
import { getImage } from "astro:assets";
import { getPosts } from "../utils"; import { getPosts } from "../utils";
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro"; import Card from "../components/Card.astro";
import Certificate from "../components/Certificate.astro"; import Certificate from "../components/Certificate.astro";
import Music from "../components/Music.astro"; import Music from "../components/Music.astro";
import BannerImg from "../assets/banner-alt.webp";
const tools = ["Proxmox", "JetBrain IDEs", "Docker", "Linux", "SQLite", "Postgres", "MySQL"]; const tools = ["Proxmox", "JetBrain IDEs", "Docker", "Linux", "SQLite", "Postgres", "MySQL"];
const languages = ["Go", "Python", "HTML", "CSS", "Sass", "TypeScript", "JavaScript", "Scratch", "PHP", "SQL", "Bash"]; const languages = ["Go", "Python", "HTML", "CSS", "Sass", "TypeScript", "JavaScript", "Scratch", "PHP", "SQL", "Bash"];
@ -15,11 +13,9 @@ const frameworks = ["Gin", "Echo", "Flask", "Svelte", "Astro", "raylib"];
const certificates = await getCollection("certificates"); const certificates = await getCollection("certificates");
const projects = await getPosts("projects"); const projects = await getPosts("projects");
const posts = await getPosts("posts"); const posts = await getPosts("posts");
const image = await getImage({src: BannerImg});
--- ---
<Layout title="Leggy Land" image={image.src} alt="alt"> <Layout title="Leggy Land">
<div class="header"> <div class="header">
<h1>Leggy Land</h1> <h1>Leggy Land</h1>
<p>Made with Coffee, lots of it.</p> <p>Made with Coffee, lots of it.</p>

16
src/pages/leg.astro
View file

@ -1,15 +1,10 @@
--- ---
import { Picture, getImage } from "astro:assets";
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import HomeButton from "../components/HomeButton.astro"; import HomeButton from "../components/HomeButton.astro";
import GwaGwa from "../assets/leg.jpg"; import GwaGwa from "../assets/fumble.jpg";
import BannerImg from "../assets/banner-alt.webp";
const image = await getImage({src: BannerImg});
--- ---
<Layout title="LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG" image={image.src} alt="alt"> <Layout title="LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG LEG">
<HomeButton /> <HomeButton />
<div class="header"> <div class="header">
@ -19,14 +14,11 @@ const image = await getImage({src: BannerImg});
<hr> <hr>
<Picture <img
src={GwaGwa} src={GwaGwa.src}
alt="Two Maned wolfs having a disagreement" alt="Two Maned wolfs having a disagreement"
width="851" width="851"
height="575" height="575"
widths={[240, 540, 720, 851]}
sizes={`(max-width: 360px) 240px, (max-width: 720px) 540px, (max-width: 1600px) 720px, 851px`}
formats={["jpeg", "webp"]}
style="height: auto" style="height: auto"
/> />
</Layout> </Layout>

8
src/pages/posts/[...slug].astro
View file

@ -17,8 +17,12 @@ export async function getStaticPaths() {
} }
const { post, prev, next } = Astro.props; const { post, prev, next } = Astro.props;
const { Content } = await post.render();
--- ---
<Layout title=`Leggy Land - ${post.data.title}` image={post.data.image.url} alt={post.data.image.alt}> <Layout title=`Leggy Land - ${post.data.title}`>
<Markdown {post} {prev} {next} base="/posts" /> <Markdown post={post} prev={prev} next={next} base="/posts">
<Content />
</Markdown>
</Layout> </Layout>

6
src/pages/posts/index.astro
View file

@ -1,17 +1,13 @@
--- ---
import { getImage } from "astro:assets";
import { getPosts } from "../../utils"; import { getPosts } from "../../utils";
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import HomeButton from "../../components/HomeButton.astro"; import HomeButton from "../../components/HomeButton.astro";
import Card from "../../components/Card.astro"; import Card from "../../components/Card.astro";
import BannerImg from "../../assets/banner-alt.webp";
const image = await getImage({src: BannerImg});
const posts = await getPosts("posts"); const posts = await getPosts("posts");
--- ---
<Layout title="Leggy Land - All Posts" image={image.src} alt="alt"> <Layout title="Leggy Land - All Posts">
<HomeButton /> <HomeButton />
<div class="header"> <div class="header">

8
src/pages/projects/[...slug].astro
View file

@ -17,8 +17,12 @@ export async function getStaticPaths() {
} }
const { post, prev, next } = Astro.props; const { post, prev, next } = Astro.props;
const { Content } = await post.render();
--- ---
<Layout title=`Leggy Land - ${post.data.title}` image={post.data.image.url} alt={post.data.image.alt}> <Layout title=`Leggy Land - ${post.data.title}`>
<Markdown {post} {prev} {next} base="/projects" /> <Markdown post={post} prev={prev} next={next} base="/posts">
<Content />
</Markdown>
</Layout> </Layout>

6
src/pages/projects/index.astro
View file

@ -1,17 +1,13 @@
--- ---
import { getImage } from "astro:assets";
import { getPosts } from "../../utils"; import { getPosts } from "../../utils";
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import Card from "../../components/Card.astro"; import Card from "../../components/Card.astro";
import HomeButton from "../../components/HomeButton.astro"; import HomeButton from "../../components/HomeButton.astro";
import BannerImg from "../../assets/banner-alt.webp";
const image = await getImage({src: BannerImg});
const projects = await getPosts("projects"); const projects = await getPosts("projects");
--- ---
<Layout title="Leggy Land - All Projects" image={image.src} alt="alt"> <Layout title="Leggy Land - All Projects">
<HomeButton /> <HomeButton />
<div class="header"> <div class="header">

2
src/styles/_banner.scss
View file

@ -9,7 +9,7 @@
overflow: hidden; overflow: hidden;
> picture > img { > img {
width: 100%; width: 100%;
height: 100%; height: 100%;