Use overflow-auto instead of overflow-scroll

Update layout
2025-08-14 21:04:53 +10:00 · 2025-08-11 20:36:46 +10:00 · 2025-08-11 18:46:16 +10:00 · 2025-08-11 17:30:49 +10:00 · 2025-08-11 14:50:28 +10:00 · 2025-08-11 14:48:58 +10:00
26 changed files with 1932 additions and 1842 deletions
--- a/.gitea/workflows/push.yaml
+++ b/.gitea/workflows/push.yaml
@@ -7,7 +7,7 @@ on:

 jobs:
  deploy:
-    runs-on: luare
+    runs-on: lilac
    steps:
      - name: Checkout
        uses: actions/checkout@v4
--- a/astro.config.js
+++ b/astro.config.js
@@ -0,0 +1,6 @@
+import { defineConfig } from "astro/config";
+import tailwindcss from "@tailwindcss/vite";
+
+export default defineConfig({
+  vite: { plugins: [tailwindcss()] },
+});
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -1,8 +0,0 @@
-// @ts-check
-import { defineConfig } from "astro/config";
-import tailwind from "@astrojs/tailwind";
-
-// https://astro.build/config
-export default defineConfig({
-  integrations: [tailwind()],
-});
--- a/package.json
+++ b/package.json
@@ -1,7 +1,6 @@
 {
  "name": "lua.re",
  "type": "module",
-  "version": "0.0.0",
  "scripts": {
    "dev": "astro dev",
    "build": "astro check && astro build",
@@ -9,10 +8,12 @@
  },
  "dependencies": {
    "@astrojs/check": "^0.9.4",
-    "@astrojs/tailwind": "^5.1.2",
-    "@fontsource/source-serif-4": "^5.1.0",
-    "astro": "^4.16.16",
-    "tailwindcss": "^3.4.15",
-    "typescript": "^5.7.2"
+    "@fontsource/faustina": "^5.2.6",
+    "@tailwindcss/typography": "^0.5.16",
+    "@tailwindcss/vite": "^4.1.11",
+    "astro": "^5.12.9",
+    "sharp": "^0.34.3",
+    "tailwindcss": "^4.1.11",
+    "typescript": "^5.9.2"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/apple-touch-icon.png
+++ b/public/apple-touch-icon.png
--- a/public/favicon-16x16.png
+++ b/public/favicon-16x16.png
--- a/public/favicon-32x32.png
+++ b/public/favicon-32x32.png
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/src/assets/banner.jpg
+++ b/src/assets/banner.jpg
--- a/src/assets/gato.jpg
+++ b/src/assets/gato.jpg
--- a/src/assets/icon.png
+++ b/src/assets/icon.png
--- a/src/assets/luaneko.jpg
+++ b/src/assets/luaneko.jpg
--- a/src/assets/miku.jpg
+++ b/src/assets/miku.jpg
--- a/src/assets/peace.jpg
+++ b/src/assets/peace.jpg
--- a/src/assets/sticker.gif
+++ b/src/assets/sticker.gif
--- a/src/classes.ts
+++ b/src/classes.ts
@@ -1,6 +0,0 @@
-export function classes(...s: (string | false | null | undefined)[]) {
-  return s
-    .flatMap((s) => (s ? s : "").split(" "))
-    .filter((s) => s)
-    .join(" ");
-}
--- a/src/components/card.astro
+++ b/src/components/card.astro
@@ -0,0 +1,16 @@
+---
+import type { HTMLAttributes, HTMLTag } from "astro/types";
+type Props = HTMLAttributes<"section"> & { tag?: HTMLTag };
+const { tag: Tag = "section", class: className, ...props } = Astro.props;
+---
+
+<Tag
+  class:list={[
+    "relative px-5 py-4 min-w-0 min-h-0 overflow-auto",
+    "bg-white rounded-lg shadow-xs",
+    className,
+  ]}
+  {...props}
+>
+  <slot />
+</Tag>
--- a/src/components/image.astro
+++ b/src/components/image.astro
@@ -0,0 +1,33 @@
+---
+import { type UnresolvedImageTransform } from "astro";
+import type { HTMLTag } from "astro/types";
+import { getImage } from "astro:assets";
+
+type Props = UnresolvedImageTransform & {
+  tag?: HTMLTag;
+  id?: string;
+  class?: string;
+};
+
+const { tag: Tag = "span", id, class: className, ...transform } = Astro.props;
+const {
+  src,
+  options: { width, height },
+} = await getImage({ format: "jpeg", ...transform });
+---
+
+<style>
+  .image {
+    background-size: cover;
+    background-position: center;
+  }
+</style>
+
+<Tag
+  id={id}
+  class:list={["image", className]}
+  style={{
+    aspectRatio: width && height ? width / height : undefined,
+    backgroundImage: `url(${JSON.stringify(src)})`,
+  }}
+/>
--- a/src/layouts/index.astro
+++ b/src/layouts/index.astro
@@ -1,14 +1,12 @@
 ---
-import "../styles/index.css";
-import "@fontsource/source-serif-4/latin.css";
-import "@fontsource/source-serif-4/latin-italic.css";
+import "./index.css";
+import icon from "@assets/icon.png";
+import sticker from "@assets/sticker.gif";
+import Image from "@components/image.astro";
+import type { HTMLAttributes } from "astro/types";

-type Props = {
-  title?: string;
-  className?: string;
-};
-
-const { title, className } = Astro.props;
+type Props = HTMLAttributes<"body"> & { title?: string };
+const { title, class: className, ...props } = Astro.props;
 ---

 <html lang="en">
@@ -16,20 +14,44 @@ const { title, className } = Astro.props;
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />

-    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
-    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
-    <link rel="icon" href="/favicon.ico" />
-    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <title>{title ?? "lua.re"}</title>
+
+    <link
+      rel="icon"
+      type={`image/${icon.format}`}
+      sizes={`${icon.width}x${icon.height}`}
+      href={icon.src}
+    />
+
+    <link
+      rel="apple-touch-icon"
+      type={`image/${icon.format}`}
+      sizes={`${icon.width}x${icon.height}`}
+      href={icon.src}
+    />

    <script
      is:inline
      defer
-      src="https://stat.lua.re/re.js"
-      data-website-id="7d601566-3611-444c-800f-d351e266c02d"></script>
-
-    <title>{title ?? "lua.re"}</title>
+      data-domain="lua.re"
+      src="https://track.lua.re/js/script.js"></script>
  </head>
-  <body class={className}>
+  <body
+    class:list={[
+      "relative max-w-screen-sm mx-auto p-4 flex flex-col",
+      className,
+    ]}
+    {...props}
+  >
    <slot />
+    <Image
+      tag="aside"
+      class:list={[
+        "fixed pointer-events-none -z-10 -bottom-10 right-0 -rotate-10 opacity-10 w-48",
+        "hidden sm:block",
+      ]}
+      format="webp"
+      src={sticker}
+    />
  </body>
 </html>
--- a/src/layouts/index.css
+++ b/src/layouts/index.css
@@ -0,0 +1,34 @@
+@import "tailwindcss";
+@import "@fontsource/faustina/latin";
+@import "@fontsource/faustina/latin-italic";
+
+@plugin "@tailwindcss/typography";
+
+@theme {
+  --font-serif: Faustina, ui-serif, Georgia, Cambria, "Times New Roman", Times,
+    serif;
+
+  --color-white: hsl(0, 0%, 99.3%);
+  --color-black: hsl(60 2.5% 41.3%);
+  --color-paper: hsl(8, 68%, 98.5%);
+
+  --text-base: 14px;
+  --text-sm: 0.85rem;
+}
+
+html {
+  @apply bg-paper text-black text-base font-serif;
+}
+
+a {
+  @apply hover:underline;
+}
+
+hr {
+  @apply border-gray-100;
+}
+
+pre {
+  @apply leading-tight;
+  font-family: inherit;
+}
--- a/src/pages/404.astro
+++ b/src/pages/404.astro
@@ -1,10 +0,0 @@
---
-import Layout from "../layouts/index.astro";
---
-
-<Layout>
-  <main class="max-w-prose mx-auto p-4 sm:p-8">
-    <h1><strong>Not found</strong></h1>
-    <p><a href="/" class="text-pink-400">Home</a></p>
-  </main>
-</Layout>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,42 +1,59 @@
 ---
-import Layout from "../layouts/index.astro";
+import Layout from "@layouts/index.astro";
+import Card from "@components/card.astro";
+import Image from "@components/image.astro";
+import miku from "@assets/miku.jpg";
+import gato from "@assets/gato.jpg";

-const socials = [
-  ["Bluesky", "bs/lua.re", "https://bsky.app/profile/lua.re"],
-  ["GitHub", "gh/luaneko", "https://github.com/luaneko"],
-];
-
-const services = [
-  ["Gitea", "git"],
-  ["Roundcube", "mail"],
-];
-
-services.sort(([_a, a], [_b, b]) => a.length - b.length || a.localeCompare(b));
+const links = {
+  git: { alt: "Git", href: "https://git.lua.re/" },
+  twt: { alt: "Twitter", href: "https://twitter.com/luanekos" },
+  mail: { alt: "Email", href: "mailto:lumi(at)lua.re" },
+  pgp: {
+    alt: "PGP Key",
+    href: "https://git.lua.re/luaneko/.profile/raw/branch/master/luaneko.pgp.pub",
+  },
+  // bsky: { alt: "Bluesky", href: "https://bsky.app/profile/lua.re" },
+};
 ---

-<Layout>
-  <pre
-    class="max-w-prose mx-auto p-4 sm:p-8 leading-tight">{
-`  ∧.,,∧ 𝜗𝜚
-(  ̳• · • ̳)   ᭢
-/      づ `}<a class="mail" class="font-serif"><em><strong>lumi</strong><span class="at"> at </span>lua.re</em></a> ₊˚.⋆⁺₊
+<Layout class="sm:max-h-screen">
+  <Card tag="main" class="space-y-3">
+    <h1 class="hidden"><a href="/" title="lua.re">lua.re</a></h1>
+    <pre>{
+`   ∧...∧  𝜗𝜚
+ (  ̳• · • ̳)    ᭢
+ /         づ   ////  ⋆.⁺₊`
+   }</pre>
+    <p>
+      hi i'm luaneko ^^<br />
+      this is my site where i put a bunch of random stuff !<br />
+    </p>
+    <Image tag="p" src={miku} class="rounded-lg max-w-80" />
+    <pre>{
+`          へ     ╱ 、
+    ૮  -   ՛ )  (˚ˎ 。7
+     /   ⁻  ៸|   |、˜〵   ᢉ𐭩 p&g
+乀(ˍ, ل ل  じしˍ,)ノ`
+   }</pre>
+    <p>i love cats they go miau miau<br /></p>
+    <Image tag="p" src={gato} class="block rounded-lg max-w-60" />
+    <p>best way to contact me is by twt or mail {`<3`}<br /></p>
+  </Card>

-{socials.map(([name, text, href]) => (
-<>・:。<small><a href={href} title={name}>{text}</a></small>
-</>))}
-{services.map(([name, sub,href], i) => (
-<>{i ? " · " : ""}</><small><a href={href ?? `https://${sub}.lua.re/`} title={name}>{sub}</a></small>
-))}
+  <footer class="flex flex-row space-x-1 mt-3 text-sm">
+    {
+      Object.entries(links).map(([name, { alt, href }], i) => [
+        i ? <span>·</span> : null,
+        <a href={href} title={alt} set:text={name} />,
+      ])
+    }
+  </footer>

-🍡 🌸 🎀 🌙</pre>
+  <script>
+    for (const link of document.querySelectorAll(`a[href^="mailto:"]`)) {
+      const href = link.attributes.getNamedItem("href")!;
+      href.value = href.value.replace("(at)", "@");
+    }
+  </script>
 </Layout>
-
-<script>
-  // don't scrape my email please
-  const node = document.querySelector(`.mail`);
-
-  if (node) {
-    node.querySelector(`.at`)?.replaceWith("@");
-    node.setAttribute("href", `mailto:${node.textContent}`);
-  }
-</script>
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -1,12 +0,0 @@
-html {
-  @apply bg-bg font-serif;
-  font-size: 14px;
-}
-
-a {
-  @apply hover:underline;
-}
-
-pre {
-  font-family: inherit;
-}
--- a/tailwind.config.mjs
+++ b/tailwind.config.mjs
@@ -1,18 +0,0 @@
-import defaultTheme from "tailwindcss/defaultTheme";
-
-/** @type {import('tailwindcss').Config} */
-export default {
-  content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
-  theme: {
-    extend: {
-      fontFamily: {
-        serif: [`"Source Serif 4"`, ...defaultTheme.fontFamily.serif],
-      },
-      colors: {
-        bg: "#ffefef",
-        pink: "#f3d0d7",
-      },
-    },
-  },
-  plugins: [],
-};
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,3 +1,12 @@
 {
-  "extends": "astro/tsconfigs/strict"
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@assets/*": ["src/assets/*", "public/*"],
+      "@layouts/*": ["src/layouts/*"],
+      "@components/*": ["src/components/*"],
+      "@pages/*": ["src/pages/*"]
+    }
+  }
 }
Author	SHA1	Message	Date
luaneko	5316bae6fe	Use overflow-auto instead of overflow-scroll All checks were successful Deploy website / deploy (push) Successful in 30s Details	2025-08-14 21:04:53 +10:00
luaneko	07daf42133	Update layout All checks were successful Deploy website / deploy (push) Successful in 23s Details	2025-08-11 20:36:46 +10:00
luaneko	089523d5b4	Update layout All checks were successful Deploy website / deploy (push) Successful in 19s Details	2025-08-11 18:46:16 +10:00
luaneko	5fc6dafbbb	Add sticker All checks were successful Deploy website / deploy (push) Successful in 20s Details	2025-08-11 17:30:49 +10:00
luaneko	b3966fbb37	Fix broken pgp link All checks were successful Deploy website / deploy (push) Successful in 18s Details	2025-08-11 14:50:28 +10:00
luaneko	e1dc0f17eb	Update page All checks were successful Deploy website / deploy (push) Successful in 17s Details	2025-08-11 14:48:58 +10:00
luaneko	2176d60f8e	Update All checks were successful Deploy website / deploy (push) Successful in 18s Details	2025-08-11 13:50:50 +10:00
luaneko	856c7d2fb4	Use flexbox All checks were successful Deploy website / deploy (push) Successful in 17s Details	2025-08-11 13:45:22 +10:00
luaneko	0457c77008	Update page All checks were successful Deploy website / deploy (push) Successful in 20s Details	2025-08-11 13:19:51 +10:00
luaneko	080fdf4c7a	Fix missing sharp build error All checks were successful Deploy website / deploy (push) Successful in 18s Details	2025-08-11 13:11:51 +10:00
luaneko	d22fc66d90	Update page Some checks failed Deploy website / deploy (push) Failing after 17s Details	2025-08-11 13:10:14 +10:00
luaneko	a11a608afc	Style update All checks were successful Deploy website / deploy (push) Successful in 18s Details	2025-08-11 09:57:12 +10:00
luaneko	0f4bcfd094	Remove unused font dependency All checks were successful Deploy website / deploy (push) Successful in 18s Details	2025-08-11 09:36:04 +10:00
luaneko	38df3907c6	Update website All checks were successful Deploy website / deploy (push) Successful in 24s Details	2025-08-11 09:35:03 +10:00
luaneko	f30e079bbe	Add logos All checks were successful Deploy website / deploy (push) Successful in 17s Details	2025-06-04 03:22:26 +10:00
luaneko	91e4d68e8e	Fix duplicated class attribute All checks were successful Deploy website / deploy (push) Successful in 14s Details	2025-06-02 20:33:37 +10:00
luaneko	ed75c53356	Fix gitea workflow All checks were successful Deploy website / deploy (push) Successful in 17s Details	2025-06-02 20:31:20 +10:00
luaneko	fb911cb3ea	Upgrade to tailwind v4 Some checks failed Deploy website / deploy (push) Has been cancelled Details	2025-06-02 20:28:47 +10:00
luaneko	2e690631ff	Fix margins on mobile All checks were successful Deploy website / deploy (push) Successful in 14s Details	2024-12-05 06:07:10 +11:00
luaneko	c1b38e217e	Fix syntax error All checks were successful Deploy website / deploy (push) Successful in 14s Details	2024-12-04 20:37:02 +11:00
luaneko	e9adb6f953	Update homepage Some checks failed Deploy website / deploy (push) Failing after 11s Details	2024-12-04 20:25:52 +11:00
luaneko	eaeb02eeff	Add service link to memos All checks were successful Deploy website / deploy (push) Successful in 13s Details	2024-12-04 18:32:59 +11:00
luaneko	2eabfac223	Update favicon	2024-12-04 18:32:16 +11:00