check in
This commit is contained in:
commit
73cc1d1ac8
GPG key ID:
1669C533B8CF6D89
13 changed files with 336 additions and 0 deletions
16
.gitignore
vendored
Normal file
16
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
# Local
|
||||
.DS_Store
|
||||
*.local
|
||||
*.log*
|
||||
|
||||
# Dist
|
||||
node_modules
|
||||
dist/
|
||||
|
||||
# IDE
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
|
||||
# Dumb files
|
||||
dumb
|
||||
1
.npmrc
Normal file
1
.npmrc
Normal file
|
|
@ -0,0 +1 @@
|
|||
@hamcha:registry=https://git.fromouter.space/api/packages/hamcha/npm/
|
||||
23
README.md
Normal file
23
README.md
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
# Rspack Project
|
||||
|
||||
## Setup
|
||||
|
||||
Install the dependencies:
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
## Get Started
|
||||
|
||||
Start the dev server:
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Build the app for production:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
30
biome.json
Normal file
30
biome.json
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
{
|
||||
"$schema": "https://biomejs.dev/schemas/1.8.0/schema.json",
|
||||
"organizeImports": {
|
||||
"enabled": true
|
||||
},
|
||||
"vcs": {
|
||||
"enabled": true,
|
||||
"clientKind": "git",
|
||||
"useIgnoreFile": true
|
||||
},
|
||||
"formatter": {
|
||||
"indentStyle": "space"
|
||||
},
|
||||
"javascript": {
|
||||
"formatter": {
|
||||
"quoteStyle": "single"
|
||||
}
|
||||
},
|
||||
"css": {
|
||||
"parser": {
|
||||
"cssModules": true
|
||||
}
|
||||
},
|
||||
"linter": {
|
||||
"enabled": true,
|
||||
"rules": {
|
||||
"recommended": true
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
bun.lockb
Normal file
BIN
bun.lockb
Normal file
Binary file not shown.
2
bunfig.toml
Normal file
2
bunfig.toml
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
[install.scopes]
|
||||
hamcha = "https://git.fromouter.space/api/packages/hamcha/npm/"
|
||||
15
index.html
Normal file
15
index.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Is this your weeb card?</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="src/index.ts"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
18
package.json
Normal file
18
package.json
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
{
|
||||
"name": "is-this-your-weeb-card",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"scripts": {
|
||||
"start": "vite"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@biomejs/biome": "^1.9.4",
|
||||
"typescript": "^5.6.3",
|
||||
"vite": "^5.4.10",
|
||||
"vite-plugin-wasm": "^3.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@hamcha/domutil": "^1.0.0",
|
||||
"@hamcha/weeblib": "0.1.2"
|
||||
}
|
||||
}
|
||||
1
src/card-data.json
Normal file
1
src/card-data.json
Normal file
File diff suppressed because one or more lines are too long
127
src/index.css
Normal file
127
src/index.css
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
color: #fff;
|
||||
background-image: linear-gradient(to bottom, #020917, #101725);
|
||||
}
|
||||
|
||||
input,
|
||||
button,
|
||||
body {
|
||||
font-family: "Noto Sans JP", Inter, Avenir, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
main {
|
||||
display: flex;
|
||||
min-height: 100vh;
|
||||
line-height: 1.1;
|
||||
text-align: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
|
||||
h1 {
|
||||
font-size: 3.6rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 400;
|
||||
opacity: 0.8;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
img.bg {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: scale-down;
|
||||
z-index: -1;
|
||||
filter: blur(20px);
|
||||
|
||||
&.revealed {
|
||||
filter: none;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 10rem;
|
||||
word-spacing: 10px;
|
||||
}
|
||||
|
||||
.manacost {
|
||||
font-weight: 300;
|
||||
margin-left: 1rem;
|
||||
font-size: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
|
||||
.manapip {
|
||||
display: inline-block;
|
||||
border: 1px solid white;
|
||||
padding: 0.2em;
|
||||
min-width: 1.1em;
|
||||
height: 1.1em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cardbox {
|
||||
width: 50rem;
|
||||
text-align: left;
|
||||
padding: 2rem;
|
||||
background-color: rgba(2, 9, 23, 0.8);
|
||||
border-radius: 1rem;
|
||||
word-spacing: 10px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2rem;
|
||||
position: relative;
|
||||
|
||||
.flavor {
|
||||
font-style: italic;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.power {
|
||||
word-spacing: initial;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
|
||||
button {
|
||||
font-size: 1rem;
|
||||
color: #101725;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 2rem;
|
||||
border: 0;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
transition: all 100ms ease-out;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
border-color: transparent;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
77
src/index.ts
Normal file
77
src/index.ts
Normal file
|
|
@ -0,0 +1,77 @@
|
|||
import { $el } from '@hamcha/domutil';
|
||||
import { convert_to_hiragana } from '@hamcha/weeblib';
|
||||
|
||||
import cardData from './card-data.json';
|
||||
import './index.css';
|
||||
|
||||
interface Card {
|
||||
manaCost: string;
|
||||
name: string;
|
||||
type: string;
|
||||
text: string;
|
||||
flavorText: string;
|
||||
power?: number;
|
||||
toughness?: number;
|
||||
italianImage: string;
|
||||
image: string;
|
||||
}
|
||||
|
||||
const cards = cardData as Card[];
|
||||
|
||||
const parseMC = (mc: string) =>
|
||||
mc
|
||||
.slice(1, -1)
|
||||
.split('}{')
|
||||
.map((v) => $el('span.manapip', v));
|
||||
|
||||
let main = $el('main');
|
||||
|
||||
const render = () => {
|
||||
const randomCard = cards[Math.floor(Math.random() * cards.length)];
|
||||
const cardImage = $el('img.bg', { src: randomCard.italianImage });
|
||||
|
||||
main.remove();
|
||||
main = $el(
|
||||
'main',
|
||||
cardImage,
|
||||
$el(
|
||||
'h1',
|
||||
convert_to_hiragana(randomCard.name),
|
||||
randomCard.manaCost
|
||||
? $el('span.manacost', ...parseMC(randomCard.manaCost))
|
||||
: '',
|
||||
),
|
||||
$el(
|
||||
'article.cardbox',
|
||||
$el('h2', convert_to_hiragana(randomCard.type.replace(' ', ''))),
|
||||
$el('p.rules', convert_to_hiragana(randomCard.text)),
|
||||
randomCard.flavorText
|
||||
? $el('p.flavor', convert_to_hiragana(randomCard.flavorText))
|
||||
: '',
|
||||
randomCard.power
|
||||
? $el('p.power', `${randomCard.power} / ${randomCard.toughness}`)
|
||||
: '',
|
||||
),
|
||||
$el(
|
||||
'section.actions',
|
||||
$el(
|
||||
'button',
|
||||
{
|
||||
type: 'button',
|
||||
'@click': () => {
|
||||
cardImage.classList.toggle('revealed');
|
||||
},
|
||||
},
|
||||
convert_to_hiragana('Rivela'),
|
||||
),
|
||||
$el(
|
||||
'button',
|
||||
{ type: 'button', '@click': () => render() },
|
||||
convert_to_hiragana('Nuova carta'),
|
||||
),
|
||||
),
|
||||
);
|
||||
document.body.appendChild(main);
|
||||
};
|
||||
|
||||
render();
|
||||
21
tsconfig.json
Normal file
21
tsconfig.json
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"lib": ["DOM", "ES2020"],
|
||||
"module": "ESNext",
|
||||
"noEmit": true,
|
||||
"strict": true,
|
||||
"skipLibCheck": true,
|
||||
"isolatedModules": true,
|
||||
"resolveJsonModule": true,
|
||||
"moduleResolution": "bundler",
|
||||
"useDefineForClassFields": true,
|
||||
"allowImportingTsExtensions": true
|
||||
},
|
||||
"include": ["src"],
|
||||
"ts-node": {
|
||||
"compilerOptions": {
|
||||
"module": "CommonJS"
|
||||
}
|
||||
}
|
||||
}
|
||||
5
vite.config.ts
Normal file
5
vite.config.ts
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
import wasm from 'vite-plugin-wasm';
|
||||
|
||||
export default {
|
||||
plugins: [wasm()],
|
||||
};
|
||||
Loading…
Reference in a new issue