Some news and stuff

This commit is contained in:
2025-04-18 16:33:51 +02:00
parent 0b677ad12e
commit ee748bfdb8
12 changed files with 96 additions and 311 deletions
+15 -31
View File
@@ -1,36 +1,20 @@
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
# How to post news
## Getting Started
1. Create a new markdown file in the `news` directory, name it chronologically like `2025-04-16-<title>.md`
2. Add the following frontmatter:
First, run the development server:
```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
```markdown
---
authors: Kleo dev, John Doe
title: Hello World
description: The brown fox jumps over the lazy dog
image: <your thumbnail url>
date: <year>-<month>-<day>
tags: <tag1, tag2>
---
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
3. Add the content of the news after the frontmatter
Learn markdown here: https://www.markdownguide.org/getting-started/
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
## Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
4. Add the image to the `public` directory (if you're using a local image), the image will be referenced in the frontmatter like this: `image: /<image.png>`
+22
View File
@@ -0,0 +1,22 @@
---
authors: Kleo
title: Refactoring
description: The current codebase isn't practical, so we are refractoring it
image: https://preview.redd.it/axscigvvfik71.png?auto=webp&s=ddd458f865c6f50d21a66fe76dc12a07c8b1e198
date: 2025-04-18
tags: development, news
---
Due to Minecraft's nature of refactors for the past decade (which is normal for all apps), we have decided to refactor the codebase to make it more maintainable and practical. This will also take us in other versions of Minecraft.
We will be working on this in the next few weeks trying to improve both the codebase and the user experience.
## Goals
- 📖 Document every change done to the code, both in discord and in the github wiki, this is mandatory.
- 🧩 Separate as much code from Minecraft as possible (abstractions), important for adding other versions.
- 🎨 Make the UI as customizable as possible, good for user experience, we should keep this in mind.
For updates, check out our [Discord](https://discord.gg/HFRsNxfCqT) or [GitHub issue](https://github.com/saturnclientmc/saturnclient/issues/1)
---
Credits to [Electronic_Sample_96](https://www.reddit.com/r/Minecraft/comments/pejvos/an_ultrawide_wallpaper_on_minecraft_2560_x_1080/) for the image
-243
View File
@@ -1,243 +0,0 @@
---
authors: Kleo dev, John Doe
title: Testing
description: Test
image: /background.png
date: 2025-04-16
tags: test, testing
---
---
**Advertisement :)**
- **[pica](https://nodeca.github.io/pica/demo/)** - high quality and fast image
resize in browser.
- **[babelfish](https://github.com/nodeca/babelfish/)** - developer friendly
i18n with plurals support and easy syntax.
You will like those projects!
---
# h1 Heading 8-)
## h2 Heading
### h3 Heading
#### h4 Heading
##### h5 Heading
###### h6 Heading
## Horizontal Rules
---
---
---
## Typographic replacements
Enable typographer option to see result.
(c) (C) (r) (R) (tm) (TM) (p) (P) +-
test.. test... test..... test?..... test!....
!!!!!! ???? ,, -- ---
"Smartypants, double quotes" and 'single quotes'
## Emphasis
**This is bold text**
**This is bold text**
_This is italic text_
_This is italic text_
~~Strikethrough~~
## Blockquotes
> Blockquotes can also be nested...
>
> > ...by using additional greater-than signs right next to each other...
> >
> > > ...or with spaces between arrows.
## Lists
Unordered
- Create a list by starting a line with `+`, `-`, or `*`
- Sub-lists are made by indenting 2 spaces:
- Marker character change forces new list start:
- Ac tristique libero volutpat at
* Facilisis in pretium nisl aliquet
- Nulla volutpat aliquam velit
- Very easy!
Ordered
1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa
4. You can use sequential numbers...
5. ...or keep all the numbers as `1.`
Start numbering with offset:
57. foo
1. bar
## Code
Inline `code`
Indented code
// Some comments
line 1 of code
line 2 of code
line 3 of code
Block code "fences"
```
Sample text here...
```
Syntax highlighting
```js
var foo = function (bar) {
return bar++;
};
console.log(foo(5));
```
## Tables
| Option | Description |
| ------ | ------------------------------------------------------------------------- |
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
Right aligned columns
| Option | Description |
| -----: | ------------------------------------------------------------------------: |
| data | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext | extension to be used for dest files. |
## Links
[link text](http://dev.nodeca.com)
[link with title](http://nodeca.github.io/pica/demo/ "title text!")
Autoconverted link https://github.com/nodeca/pica (enable linkify to see)
## Images
![Minion](https://octodex.github.com/images/minion.png)
![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat")
Like links, Images also have a footnote style syntax
![Alt text][id]
With a reference later in the document defining the URL location:
[id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat"
## Plugins
The killer feature of `markdown-it` is very effective support of
[syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin).
### [Emojies](https://github.com/markdown-it/markdown-it-emoji)
> Classic markup: :wink: :cry: :laughing: :yum:
>
> Shortcuts (emoticons): :-) :-( 8-) ;)
see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji.
### [Subscript](https://github.com/markdown-it/markdown-it-sub) / [Superscript](https://github.com/markdown-it/markdown-it-sup)
- 19^th^
- H~2~O
### [\<ins>](https://github.com/markdown-it/markdown-it-ins)
++Inserted text++
### [\<mark>](https://github.com/markdown-it/markdown-it-mark)
==Marked text==
### [Footnotes](https://github.com/markdown-it/markdown-it-footnote)
Footnote 1 link[^first].
Footnote 2 link[^second].
Inline footnote^[Text of inline footnote] definition.
Duplicated footnote reference[^second].
[^first]: Footnote **can have markup**
and multiple paragraphs.
[^second]: Footnote text.
### [Definition lists](https://github.com/markdown-it/markdown-it-deflist)
Term 1
: Definition 1
with lazy continuation.
Term 2 with _inline markup_
: Definition 2
{ some code, part of Definition 2 }
Third paragraph of definition 2.
_Compact style:_
Term 1
~ Definition 1
Term 2
~ Definition 2a
~ Definition 2b
### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr)
This is HTML abbreviation example.
It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on.
\*[HTML]: Hyper Text Markup Language
### [Custom containers](https://github.com/markdown-it/markdown-it-container)
::: warning
_here be dragons_
:::
Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 174 KiB

+2 -2
View File
@@ -2,8 +2,8 @@ import type { Metadata } from "next";
import "./globals.css";
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
title: "Saturn Client",
description: "The best open source Minecraft client",
};
export default function RootLayout({
+6 -1
View File
@@ -26,4 +26,9 @@ ol {
img {
border-radius: 10px;
}
}
p a {
text-decoration: underline;
color: #e2bf7d;
}
+30 -1
View File
@@ -2,5 +2,34 @@ import Markdown from "react-markdown";
import "./Markdown.css";
export default function Md({ children }: { children: string }) {
return <Markdown>{children}</Markdown>;
return (
<Markdown
components={{
a: ({ node, ...props }) => (
<a {...props} target="_blank" rel="noopener noreferrer" />
),
h1: ({ node, ...props }) => (
<h1
{...props}
className="font-bold pb-3"
/>
),
h2: ({ node, ...props }) => (
<h2
{...props}
className="font-bold pb-3"
/>
),
h3: ({ node, ...props }) => (
<h3
{...props}
className="font-bold pb-1"
/>
),
}}
>
{children.replaceAll("\n\n", "\n\n &nbsp;\n\n")}
</Markdown>
);
}
+4 -8
View File
@@ -18,9 +18,9 @@ export default async function News({
);
return (
<div className="flex-1 flex flex-col h-screen">
<div className="flex flex-col min-h-screen">
<div
className="bg-[url('/background.png')] bg-center bg-no-repeat h-96"
className="bg-center bg-no-repeat h-96 flex-shrink-0"
style={{ backgroundImage: `url(${image})` }}
>
<Header />
@@ -29,12 +29,8 @@ export default async function News({
{title}
</h1>
<p className="m-auto w-max font-['Panton'] !text-2xl mt-5">
{description}
</p>
<p className="m-auto w-max font-['Panton'] !text-xl">
written by {authors.join(", ")}
</p>
<p className="m-auto w-max !text-xl mt-5">{description}</p>
<p className="m-auto w-max !text-lg">written by {authors.join(", ")}</p>
</div>
<div className="w-[54rem] mx-auto mt-5">
+14 -10
View File
@@ -23,23 +23,27 @@ export default function News() {
<div className="py-8 px-5 w-full grid grid-rows-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 fade-in-up">
{newsList.map((news, i) => (
<Link
href={`/news/${news.id}`}
className="hover:scale-[1.02] transform transition duration-300"
key={i}
>
href={`/news/${news.id}`}
className="block"
key={i}
>
<div className="h-48 rounded-2xl overflow-hidden relative group p-4">
{/* Zoomable background image layer */}
<div
className="absolute inset-0 bg-cover bg-center transition-transform duration-300 group-hover:scale-105"
style={{
background: `url('${news.image}')`,
backgroundSize: "cover",
backgroundRepeat: "no-repeat",
backgroundImage: `url('${news.image}')`,
}}
className="object-cover h-48 rounded-2xl p-4"
>
/>
{/* Content layer, above the image */}
<div className="relative z-10 text-white">
<h2 className="text-3xl font-black">{news.title}</h2>
<p className="text-xl">{news.description}</p>
<p className="text-md">{news.date}</p>
</div>
</Link>
</div>
</Link>
))}
</div>
+1 -14
View File
@@ -1,18 +1,5 @@
import Image from "next/image";
import Link from "next/link";
import {
Book,
BookOpen,
BookOpenText,
Download,
Github,
House,
Instagram,
List,
Newspaper,
Text,
Users,
} from "lucide-react";
import Header from "@/components/Header";
import Footer from "@/components/Footer";
@@ -32,7 +19,7 @@ export default function Home() {
<h1 className="text-5xl font-black font-['Panton'] fade-in-up">
Saturn Client
</h1>
<p className="text-xl text-white mix-blend-difference font-['Panton'] fade-in-up">
<p className="text-xl text-white font-['Panton'] font-bold mix-blend-difference fade-in-up">
The best open source Minecraft client
</p>
+2 -1
View File
@@ -1,4 +1,5 @@
import { readdirSync, readFileSync } from "fs";
import smartSplit from "./smartSplit";
export interface News {
authors: string[];
@@ -22,7 +23,7 @@ export function parseNews(news: string, id: string): News {
};
content.split("\n").forEach((v) => {
const [key, value] = v.split(":").map((v) => v.trim());
const [key, value] = smartSplit(v, ":", 2).map((v) => v.trim());
if (key === "authors") {
params.authors = value.split(",").map((v) => v.trim());
} else if (