Init

.eslintrc.json

@@ -0,0 +1,20 @@
+{
+  "extends": [
+    "next/core-web-vitals",
+    "next/typescript"
+  ],
+  "rules": {
+    "semi": [
+      2,
+      "never"
+    ],
+    "quotes": [
+      2,
+      "single",
+      {
+        "avoidEscape": true
+      }
+    ],
+    "@typescript-eslint/no-explicit-any": "off"
+  }
+}

.github/workflows/node.js.yml

@@ -0,0 +1,30 @@
+# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
+# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs
+
+name: Node.js CI
+
+on:
+  push:
+    branches: [ "master" ]
+  pull_request:
+    branches: [ "master" ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [22.x]
+
+    steps:
+    - uses: actions/checkout@v4
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v4
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - run: npm install    
+    - run: npm run lint
+    - run: npm run build 

.gitignore

@@ -0,0 +1,40 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+
+# WS
+.idea

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Ilya Kirillov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

Procfile

@@ -0,0 +1 @@
+web: npm start

README.md

@@ -0,0 +1,15 @@
+# 🈷️  Wani Fast Cards
+
+[🔗 wani-fast-cards.darthorimar.me](https://wani-fast-cards.darthorimar.me/)
+
+I created this app to briefly review the [WaniKani](https://wanikani.com) kanji at a level where I have unlocked (almost) all of them. It helps me retain kanji better in my memory and stop confusing them with each other :)
+
+# 🏗️ Building
+
+The app is hosted at [wani-fast-cards.darthorimar.me](https://wani-fast-cards.darthorimar.me), but it can also be built and run locally.
+
+The app is written with Next.js and React.
+
+- Use `npm run dev` to run a development version of the app.
+- Use `npm run start` to run a production version of the site.
+- Use `npm run build` to create a production build of the site.

app/componets/center.tsx

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react'
+
+export function Center(
+    { children }: { children: ReactNode }
+) {
+    return <div className='flex items-center justify-center mt-12' style={{ minHeight: '85dvh' }}>
+        <div>
+            {children}
+        </div>
+    </div>
+}

app/componets/footer.tsx

@@ -0,0 +1,18 @@
+import { FaGithub, FaGlobe, FaLinkedin } from 'react-icons/fa'
+
+export function Footer() {
+    return <footer className='mx-auto p-4 text-default-400'>
+        <p className='text-center'>Created by <a href='https://darthorimar.github.io' target='_blank'>Darthorimar</a></p>
+        <div className='flex gap-2 items-center justify-center mt-2'>
+            <a href='https://darthorimar.github.io' target='_blank'>
+                <FaGlobe color='hsl(var(--nextui-default-400))' />
+            </a>
+            <a href='https://github.com/darthorimar' target='_blank' >
+                <FaGithub color='hsl(var(--nextui-default-400))' />
+            </a>
+            <a href='https://www.linkedin.com/in/ilia-kirillov/' target='_blank' >
+                <FaLinkedin color='hsl(var(--nextui-default-400))' />
+            </a>
+        </div>
+    </footer>
+}

app/componets/github_ribbon.tsx

@@ -0,0 +1,38 @@
+export function GitHubRibbon() {
+    return <a
+        href='https://github.com/darthorimar/wani-fast-cards'
+        className='github-corner'
+        aria-label='View source on GitHub'
+        target='_blank'
+    >
+        <svg
+            width={80}
+            height={80}
+            viewBox='0 0 250 250'
+            style={{
+                fill: 'hsl(var(--nextui-default-50))',
+                color: 'hsl(var(--nextui-default-400))',
+                position: 'absolute',
+                top: 0,
+                border: 0,
+                right: 0
+            }}
+            aria-hidden='true'
+        >
+            <path d='M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z' />
+            <path
+                d='M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2'
+                fill='currentColor'
+                style={{ transformOrigin: '130px 106px' }}
+                className='octo-arm'
+            />
+            <path
+                d='M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z'
+                fill='currentColor'
+                className='octo-body'
+            />
+        </svg>
+    </a>
+
+
+}

app/globals.css

@@ -0,0 +1,62 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --background: #ffffff;
+  --foreground: #171717;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+
+body {
+  color: var(--foreground);
+  background: var(--background);
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+@layer utilities {
+  .text-balance {
+    text-wrap: balance;
+  }
+}
+
+
+/* <github ribbon> */
+.github-corner:hover .octo-arm {
+  animation: octocat-wave 560ms ease-in-out
+}
+
+@keyframes octocat-wave {
+
+  0%,
+  100% {
+    transform: rotate(0)
+  }
+
+  20%,
+  60% {
+    transform: rotate(-25deg)
+  }
+
+  40%,
+  80% {
+    transform: rotate(10deg)
+  }
+}
+
+@media (max-width:500px) {
+  .github-corner:hover .octo-arm {
+    animation: none
+  }
+
+  .github-corner .octo-arm {
+    animation: octocat-wave 560ms ease-in-out
+  }
+}
+/* </github ribbon> */