arthur/spanish-learner
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/spanish-learner.git synced 2026-01-14 12:14:39 +01:00
Code Issues Packages Projects Releases Wiki Activity

Working

Browse Source
This commit is contained in:
Arthur Danjou
2024-08-14 15:34:06 +02:00
parent 34937fc3c9
commit 2d64c753cc
8 changed files with 191 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
app/app.vue
View File

@@ -3,15 +3,28 @@ useHead({
link: [{ rel: 'icon', type: 'image/png', href: '/favicon.ico' }],
title: 'Spanish Learning Process • By Arthur Danjou',
})
const mode = useCookie('mode')
mode.value = mode.value || 'Spanish'
</script>
<template>
<div>
<NuxtLoadingIndicator />
<UContainer>
<div class="bg-neutral-900 rounded-lg max-h-[96vh] h-[96vh] overflow-scroll p-4">
<div class="my-4 flex items-center justify-between">
<p>Mode: {{ mode }}</p>
<UButton
:color="mode === 'Spanish' ? 'cyan' : 'yellow'"
variant="solid"
:label="mode === 'Spanish' ? 'Switch to French' : 'Switch to Spanish'"
@click="mode === 'Spanish' ? mode = 'French' : mode = 'Spanish'"
/>
</div>
<div class="bg-neutral-900 rounded-lg max-h-[90vh] h-[90vh] overflow-scroll p-4">
<Verbs />
<Words />
<Demonstratifs />
<Modals />
<Terminaisons />
<Prononciation />

46
app/components/Demonstratifs.vue Normal file
View File

@@ -0,0 +1,46 @@
<script setup lang="ts">
const columns = [
{
key: 'french',
label: 'French',
},
{
key: 'proche',
label: 'Proche',
},
{
key: 'loin',
label: 'Loin',
},
{
key: 'lointain',
label: 'Très éloigné',
},
]
const rows = [
{
french: 'ce / cet',
proche: 'este',
loin: 'ese',
lointain: 'aquel',
},
{
french: 'cette',
proche: 'esta',
loin: 'esa',
lointain: 'aquella',
},
{
french: 'ces',
proche: 'estos / estas',
loin: 'esos / esas',
lointain: 'aquellos / aquellas',
},
]
</script>
<template>
<UDivider class="mt-12 mb-8" size="lg" label="Démonstratifs" />
<UTable :rows="rows" :columns="columns" />
</template>

17
app/components/Verbs.vue
View File

@@ -6,15 +6,19 @@ async function refreshVerb() {
revealedVerb.value = false
await refreshVerbData()
}
const mode = useCookie('mode')
</script>
<template>
<div v-if="verb" class="space-y-4 mx-auto flex flex-col justify-center">
<div class="flex gap-2 items-end">
<div class="flex gap-2 items-center">
<h3 class="text-neutral-500">
Verbos:
</h3>
<h1 class="font-bold">
<h1 v-if="mode === 'Spanish'" class="font-bold">
{{ verb.verb }}
</h1>
<h1 v-else class="font-bold p-1 rounded-md" :class="revealedVerb ? 'duration-300' : 'bg-gray-700 text-gray-700'">
{{ verb.verb }}
</h1>
</div>
@@ -23,14 +27,17 @@ async function refreshVerb() {
Typo:
</h3>
<h1 class="font-bold">
{{ verb.type }}
-{{ verb.verb.slice(-2) }}
</h1>
</div>
<div class="flex gap-2 items-end cursor-pointer" @click.prevent="revealedVerb = true">
<div class="flex gap-2 items-center">
<h3 class="text-neutral-500">
Traduccion:
</h3>
<h1 class="font-bold" :class="revealedVerb ? 'duration-300' : 'bg-black text-black'">
<h1 v-if="mode === 'Spanish'" class="font-bold p-1 rounded-md" :class="revealedVerb ? 'duration-300' : 'bg-gray-700 text-gray-700'">
{{ verb.translation }}
</h1>
<h1 v-else class="font-bold">
{{ verb.translation }}
</h1>
</div>

25
app/components/Words.vue
View File

@@ -1,36 +1,37 @@
<script setup lang="ts">
const { data: word, refresh: refreshWordData } = await useAsyncData('word', async () => $fetch('/api/word'))
const revealedWord = ref(false)
async function refreshWord() {
revealedWord.value = false
await refreshWordData()
}
const mode = useCookie('mode')
</script>
<template>
<UDivider class="mt-12 mb-8" size="lg" label="Palabras" />
<div v-if="word" class="space-y-4 mx-auto flex flex-col justify-center">
<div class="flex gap-2 items-end">
<div class="flex gap-2 items-center">
<h3 class="text-neutral-500">
Palabra:
</h3>
<h1 class="font-bold">
<h1 v-if="mode === 'Spanish'" class="font-bold">
{{ word.word }}
</h1>
<h1 v-else class="font-bold p-1 rounded-md" :class="revealedWord ? 'duration-300' : 'bg-gray-700 text-gray-700'">
{{ word.word }}
</h1>
</div>
<div class="flex gap-2 items-end">
<h3 class="text-neutral-500">
Typo:
</h3>
<h1 class="font-bold">
{{ word.type }}
</h1>
</div>
<div class="flex gap-2 items-end cursor-pointer" @click.prevent="revealedWord = true">
<div class="flex gap-2 items-center cursor-pointer" @click.prevent="revealedWord = true">
<h3 class="text-neutral-500">
Traducción:
</h3>
<h1 class="font-bold" :class="revealedWord ? 'duration-300' : 'bg-black text-black'">
<h1 v-if="mode === 'Spanish'" class="font-bold p-1 rounded-md" :class="revealedWord ? 'duration-300' : 'bg-gray-700 text-gray-700'">
{{ word.translation }}
</h1>
<h1 v-else class="font-bold">
{{ word.translation }}
</h1>
</div>

2
server/database/migrations/0003_lovely_leo.sql Normal file
View File

@@ -0,0 +1,2 @@
ALTER TABLE `verbs` DROP COLUMN `type`;--> statement-breakpoint
ALTER TABLE `words` DROP COLUMN `type`;

97
server/database/migrations/meta/0003_snapshot.json Normal file
View File

@@ -0,0 +1,97 @@
{
"version": "6",
"dialect": "sqlite",
"id": "c9b4dfd7-934d-4278-89a0-754c3a104f66",
"prevId": "d7a2a05d-0984-4674-bbc3-35dbb9442202",
"tables": {
"verbs": {
"name": "verbs",
"columns": {
"id": {
"name": "id",
"type": "integer",
"primaryKey": true,
"notNull": true,
"autoincrement": false
},
"verb": {
"name": "verb",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "''"
},
"translation": {
"name": "translation",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "''"
},
"created_at": {
"name": "created_at",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "(CURRENT_DATE)"
}
},
"indexes": {},
"foreignKeys": {},
"compositePrimaryKeys": {},
"uniqueConstraints": {}
},
"words": {
"name": "words",
"columns": {
"id": {
"name": "id",
"type": "integer",
"primaryKey": true,
"notNull": true,
"autoincrement": false
},
"word": {
"name": "word",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "''"
},
"translation": {
"name": "translation",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "''"
},
"created_at": {
"name": "created_at",
"type": "text",
"primaryKey": false,
"notNull": false,
"autoincrement": false,
"default": "(CURRENT_DATE)"
}
},
"indexes": {},
"foreignKeys": {},
"compositePrimaryKeys": {},
"uniqueConstraints": {}
}
},
"enums": {},
"_meta": {
"schemas": {},
"tables": {},
"columns": {}
},
"internal": {
"indexes": {}
}
}

7
server/database/migrations/meta/_journal.json
View File

@@ -22,6 +22,13 @@
"when": 1722366523692,
"tag": "0002_amazing_khan",
"breakpoints": true
},
{
"idx": 3,
"version": "6",
"when": 1723642422742,
"tag": "0003_lovely_leo",
"breakpoints": true
}
]
}

2
server/database/schema.ts
View File

@@ -4,7 +4,6 @@ import { sql } from 'drizzle-orm'
export const verbs = sqliteTable('verbs', {
id: integer('id').primaryKey(),
verb: text('verb').default(''),
type: text('type', { enum: ['-ar', '-er', '-ir'] }),
translation: text('translation').default(''),
createdAt: text('created_at').default(sql`(CURRENT_DATE)`),
})
@@ -12,7 +11,6 @@ export const verbs = sqliteTable('verbs', {
export const words = sqliteTable('words', {
id: integer('id').primaryKey(),
word: text('word').default(''),
type: text('type').default(''),
translation: text('translation').default(''),
createdAt: text('created_at').default(sql`(CURRENT_DATE)`),
})