diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
new file mode 100644
index 0000000..3d0d5df
--- /dev/null
+++ b/.github/workflows/deploy.yml
@@ -0,0 +1,43 @@
+name: Vite Github Pages Deploy
+
+on:
+ # Runs on pushes targeting the default branch
+ push:
+ branches: ["master", "main"]
+ # Allows you to run this workflow manually from the Actions tab
+ workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+ contents: read
+ pages: write
+ id-token: write
+
+concurrency:
+ group: "pages"
+ cancel-in-progress: false
+
+jobs:
+ # Build job
+ build:
+ runs-on: ubuntu-latest
+ environment:
+ name: demo
+ url: ${{ steps.deploy_to_pages.outputs.github_pages_url }}
+ steps:
+ - name: Checkout
+ uses: actions/checkout@v3
+ - name: Set up Node
+ uses: actions/setup-node@v3
+ with:
+ node-version: 20
+ cache: "npm"
+ - name: Install dependencies
+ run: npm install
+ - name: Build
+ run: npm run build ./dist
+ - name: Vite Github Pages Deployer
+ uses: skywarth/vite-github-pages-deployer@v1.3.0
+ id: deploy_to_pages
+ with:
+ build_path: ./dist
diff --git a/package.json b/package.json
index 3845549..003653d 100644
--- a/package.json
+++ b/package.json
@@ -1,26 +1,26 @@
{
- "private": true,
- "type": "module",
- "scripts": {
- "dev": "vite",
- "build": "vite build",
- "preview": "vite preview"
- },
- "dependencies": {
- "@preact/signals": "^1.2.3",
- "preact": "^10.13.1",
- "preact-iso": "^2.6.2",
- "preact-render-to-string": "^6.4.1",
- "random-words": "^2.0.1"
- },
- "devDependencies": {
- "@preact/preset-vite": "^2.5.0",
- "eslint": "^8.57.0",
- "eslint-config-preact": "^1.3.0",
- "typescript": "^5.4.4",
- "vite": "^4.3.2"
- },
- "eslintConfig": {
- "extends": "preact"
- }
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "dev": "vite",
+ "build": "vite build",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "@preact/signals": "^1.2.3",
+ "preact": "^10.13.1",
+ "preact-iso": "^2.6.2",
+ "preact-render-to-string": "^6.4.1",
+ "random-words": "^2.0.1"
+ },
+ "devDependencies": {
+ "@preact/preset-vite": "^2.5.0",
+ "eslint": "^8.57.0",
+ "eslint-config-preact": "^1.3.0",
+ "typescript": "^5.4.4",
+ "vite": "^4.3.2"
+ },
+ "eslintConfig": {
+ "extends": "preact"
+ }
}
diff --git a/src/index.tsx b/src/index.tsx
index ba2d000..5974470 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -99,26 +99,7 @@ export function App() {
-
+
);
@@ -223,6 +204,27 @@ function DualText({ children }: { children: string }) {
);
}
+function Reference() {
+ return (
+
+ );
+}
+
if (typeof window !== "undefined") {
hydrate(, document.getElementById("app"));
}
diff --git a/src/style.css b/src/style.css
index a8b2089..7f7b31f 100644
--- a/src/style.css
+++ b/src/style.css
@@ -78,7 +78,7 @@
-webkit-text-size-adjust: 100%;
--color-text-normal: #000d;
- --color-text-light: #0007;
+ --color-text-light: #0009;
--color-background1: #eed;
--color-background2: #bba;
--color-accent1: #900;
@@ -131,7 +131,7 @@ h1 {
@media (prefers-color-scheme: dark) {
:root {
--color-text-normal: #fffd;
- --color-text-light: #fff7;
+ --color-text-light: #fff9;
--color-background1: #111;
--color-background2: #333;
}
@@ -162,13 +162,13 @@ h1 {
}
.dualtext-help > span::after {
content: attr(data-character);
+ pointer-events: none;
position: absolute;
left: 0;
right: 0;
top: 70%;
margin: auto;
font-family: var(--font-standard);
- font-style: italic;
font-size: clamp(0.45rem, 0.25em, 1rem);
font-weight: 400;
color: var(--color-text-light);
@@ -200,6 +200,7 @@ main {
display: flex;
flex-direction: column;
overflow: scroll;
+ padding-block: 1em;
}
.readingbox .dualtext-help {
@@ -209,6 +210,22 @@ main {
opacity: 0;
--color-text-light: var(--color-accent1);
}
+.readingbox .dualtext-help > span::after {
+ top: auto;
+ bottom: 70%;
+ padding: 0 0.2em 0.5em;
+ margin: 0 -0.2em 0;
+ font-size: 1em;
+ background-image: linear-gradient(
+ to top,
+ transparent,
+ var(--color-background1) 50%
+ );
+ border: 1px solid var(--color-text-light);
+ border-width: 0;
+ border-radius: 0.5em 0.5em 0 0;
+ line-height: 1;
+}
.readingbox .dualtext-help > span:hover {
opacity: 1;
}
diff --git a/vite.config.ts b/vite.config.ts
index 30846bf..a7ce2ca 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,14 +1,18 @@
-import { defineConfig } from 'vite';
-import preact from '@preact/preset-vite';
+import { UserConfig, defineConfig } from "vite";
+import preact from "@preact/preset-vite";
// https://vitejs.dev/config/
-export default defineConfig({
- plugins: [
- preact({
- prerender: {
- enabled: true,
- renderTarget: '#app',
- },
- }),
- ],
+export default defineConfig(({ command }) => {
+ const config: UserConfig = {
+ plugins: [
+ preact({
+ prerender: {
+ enabled: true,
+ renderTarget: "#app",
+ },
+ }),
+ ],
+ base: "./",
+ };
+ return config;
});