Fix the god damn cyrillic rendering

This commit is contained in:
2024-10-30 19:51:15 +01:00
parent b8aba2deb2
commit 6f753dfd9b
4 changed files with 44 additions and 40 deletions

View File

@@ -11,7 +11,7 @@ const { title } = Astro.props;
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<meta name="description" content="Astro description" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />

View File

@@ -1,6 +1,6 @@
---
import Layout from '../layouts/Layout.astro';
import Card from '../components/Card.astro';
import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
---
<Layout title="Welcome to Astro.">
@@ -63,10 +63,8 @@ import Card from '../components/Card.astro';
</main>
<div class="min-h-screen bg-gray-100 flex items-center justify-center">
<h1 class="text-4xl font-bold text-blue-600 hover:text-blue-800">
Hello Tailwind + Astro!
</h1>
</div>
<h1 class="text-4xl font-bold text-blue-600 hover:text-blue-800">Hello Tailwind + Astro!</h1>
</div>
</Layout>
<style>

View File

@@ -1,4 +1,5 @@
---
import Layout from '../layouts/Layout.astro';
import type { APIResponse, Player } from "../types";
const res = await fetch("http://localhost:3000/player");
@@ -6,34 +7,36 @@ const data: APIResponse<Player[]> = await res.json();
console.log(data);
---
<div class="overflow-x-auto p-5">
{
data.success && (
<table class="min-w-full bg-white border border-gray-300">
<thead>
<tr class="bg-gray-100">
<th class="p-4 border border-gray-300 text-left">Name</th>
<th class="p-4 border border-gray-300 text-left">Guild</th>
<th class="p-4 border border-gray-300 text-left">#Notes</th>
<th class="p-4 border border-gray-300 text-left">#Associations</th>
</tr>
</thead>
<tbody>
{data.data.map((player) => (
<tr key={player.name} class="hover:bg-gray-50">
<td class="p-4 border border-gray-300">
<a href={`/player/${player.name}`} class="text-blue-600 hover:underline">
{player.name}
</a>
</td>
<td class="p-4 border border-gray-300">{player.guild.name}</td>
<td class="p-4 border border-gray-300">{player.notes}</td>
<td class="p-4 border border-gray-300">{player.associations}</td>
<Layout title="Players">
<div class="overflow-x-auto p-5">
{
data.success && (
<table class="min-w-full bg-white border border-gray-300">
<thead>
<tr class="bg-gray-100">
<th class="p-4 border border-gray-300 text-left">Name</th>
<th class="p-4 border border-gray-300 text-left">Guild</th>
<th class="p-4 border border-gray-300 text-left">#Notes</th>
<th class="p-4 border border-gray-300 text-left">#Associations</th>
</tr>
))}
</tbody>
</table>
)
}
{!data.success && <div>{data.message}</div>}
</div>
</thead>
<tbody>
{data.data.map((player) => (
<tr key={player.name} class="hover:bg-gray-50">
<td class="p-4 border border-gray-300">
<a href={`/player/${player.name}`} class="text-blue-600 hover:underline">
{player.name}
</a>
</td>
<td class="p-4 border border-gray-300">{player.guild.name}</td>
<td class="p-4 border border-gray-300">{player.notes}</td>
<td class="p-4 border border-gray-300">{player.associations}</td>
</tr>
))}
</tbody>
</table>
)
}
{!data.success && <div>{data.message}</div>}
</div>
</Layout>

View File

@@ -1,7 +1,10 @@
---
const { name } = Astro.params;
import Layout from '../../layouts/Layout.astro';
---
<div>
<h1>Hello {name}!</h1>
</div>
<Layout title={name || "Player"}>
<div>
<h1>Hello {name}!</h1>
</div>
</Layout>