optovia/webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add KYC translations, AI button, improve chat, swap homepage sections
Some checks failed
Build Docker Image / build (push) Has been cancelled
Details

Browse Source 
- Add missing kycOverview.list translations (en + ru)
- Add AI assistant button to navigation (left of globe)
- Improve AI chat layout: fixed textarea at bottom, full width
- Swap homepage sections: How it works before Who it's for
This commit is contained in:
Ruslan Bakiev
2026-01-08 13:58:09 +07:00
parent 34c7404a42
commit 6b2208f0ae
5 changed files with 65 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/pages/clientarea/ai/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="flex flex-col h-[calc(100vh-4rem)]">
<div class="flex flex-col h-[calc(100vh-8rem)]">
<!-- Chat messages area -->
<div ref="chatContainer" class="flex-1 overflow-y-auto p-4 space-y-3">
<div ref="chatContainer" class="flex-1 overflow-y-auto p-4 pb-24 space-y-3">
<div
v-for="(message, idx) in chat"
:key="idx"
@@ -9,7 +9,7 @@
:class="message.role === 'user' ? 'justify-end' : 'justify-start'"
>
<div
class="max-w-[80%] lg:max-w-[60%] rounded-2xl px-4 py-3 shadow-sm"
class="max-w-[80%] lg:max-w-[70%] rounded-2xl px-4 py-3 shadow-sm"
:class="message.role === 'user' ? 'bg-primary text-primary-content' : 'bg-base-100 text-base-content'"
>
<Text weight="semibold" class="mb-1">
@@ -25,9 +25,9 @@
</div>
</div>
<!-- Input area pinned to bottom -->
<div class="border-t border-base-300 bg-base-100 p-4">
<form class="flex items-end gap-3 max-w-4xl mx-auto" @submit.prevent="handleSend">
<!-- Input area fixed to bottom -->
<div class="fixed bottom-0 left-0 right-0 border-t border-base-300 bg-base-100 p-4 z-30">
<form class="flex items-end gap-3 px-4 lg:px-6" @submit.prevent="handleSend">
<div class="flex-1">
<Textarea
v-model="input"

60
app/pages/index.vue
View File

@@ -1,5 +1,36 @@
<template>
<Stack gap="12">
<!-- How it works -->
<Section variant="plain">
<Stack gap="6" align="center">
<Heading :level="2">{{ $t('howto.title') }}</Heading>
<Grid :cols="1" :md="3" :gap="6">
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">🔍</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step1.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step1.description') }}</Text>
</Stack>
</Card>
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">🤝</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step2.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step2.description') }}</Text>
</Stack>
</Card>
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">⚡</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step3.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step3.description') }}</Text>
</Stack>
</Card>
</Grid>
</Stack>
</Section>
<!-- Who it's for -->
<Section variant="plain">
<Stack gap="8" align="center">
<Heading :level="2">{{ $t('roles.title') }}</Heading>
@@ -53,35 +84,6 @@
</Grid>
</Stack>
</Section>
<Section variant="plain">
<Stack gap="6" align="center">
<Heading :level="2">{{ $t('howto.title') }}</Heading>
<Grid :cols="1" :md="3" :gap="6">
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">🔍</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step1.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step1.description') }}</Text>
</Stack>
</Card>
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">🤝</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step2.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step2.description') }}</Text>
</Stack>
</Card>
<Card padding="lg">
<Stack gap="3" align="center">
<IconCircle tone="primary">⚡</IconCircle>
<Heading :level="3" weight="semibold">{{ $t('howto.step3.title') }}</Heading>
<Text tone="muted" align="center">{{ $t('howto.step3.description') }}</Text>
</Stack>
</Card>
</Grid>
</Stack>
</Section>
</Stack>
</template>