Aimpress/cohorta
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(mobile): responsive tabs grid-cols, FocusGroupSession fixed height, MyUsage table scroll

Browse source
This commit is contained in:
Vadym Samoilenko 2026-05-24 19:07:44 +01:00
parent aac5764999
commit 8edc291b59
4 changed files with 22 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/UserCreator.tsx
View file

@ -577,13 +577,13 @@ export default function UserCreator({ targetFolderId, targetFolderName }: UserCr
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
<Tabs defaultValue="basic">
<TabsList className="grid w-full grid-cols-6 sticky top-0 z-10 bg-card">
<TabsTrigger value="basic">{t('persona_editor.tab_basic')}</TabsTrigger>
<TabsTrigger value="attitudinal">{t('persona_editor.tab_attitudinal')}</TabsTrigger>
<TabsTrigger value="personality">{t('persona_editor.tab_personality')}</TabsTrigger>
<TabsTrigger value="demographics">{t('persona_editor.tab_demographics')}</TabsTrigger>
<TabsTrigger value="lifestyle">{t('persona_editor.tab_lifestyle')}</TabsTrigger>
<TabsTrigger value="extended">{t('persona_editor.tab_extended')}</TabsTrigger>
<TabsList className="grid w-full grid-cols-3 sm:grid-cols-6 sticky top-0 z-10 bg-card">
<TabsTrigger value="basic" className="text-xs sm:text-sm">{t('persona_editor.tab_basic')}</TabsTrigger>
<TabsTrigger value="attitudinal" className="text-xs sm:text-sm">{t('persona_editor.tab_attitudinal')}</TabsTrigger>
<TabsTrigger value="personality" className="text-xs sm:text-sm">{t('persona_editor.tab_personality')}</TabsTrigger>
<TabsTrigger value="demographics" className="text-xs sm:text-sm">{t('persona_editor.tab_demographics')}</TabsTrigger>
<TabsTrigger value="lifestyle" className="text-xs sm:text-sm">{t('persona_editor.tab_lifestyle')}</TabsTrigger>
<TabsTrigger value="extended" className="text-xs sm:text-sm">{t('persona_editor.tab_extended')}</TabsTrigger>
</TabsList>
<TabsContent value="basic" className="mt-6">

2
src/components/landing/UseCases.tsx
View file

@ -38,7 +38,7 @@ export default function UseCases() {
<TabsTrigger
key={id}
value={id}
className="flex-1 rounded-full text-sm font-medium data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=inactive]:text-muted-foreground transition-all py-2"
className="flex-1 rounded-full text-xs sm:text-sm font-medium data-[state=active]:bg-primary data-[state=active]:text-primary-foreground data-[state=inactive]:text-muted-foreground transition-all py-1.5 sm:py-2 px-1 sm:px-3"
>
{t(`use_cases.${id}.label`)}
</TabsTrigger>

26
src/pages/FocusGroupSession.tsx
View file

@ -1988,7 +1988,7 @@ const FocusGroupSession = () => {
onEditingChange={handleGuideEditingStateChange}
/>
<div className="flex flex-col lg:flex-row gap-6 h-[calc(100vh-12rem)]">
<div className="flex flex-col lg:flex-row gap-6 lg:h-[calc(100vh-12rem)]">
<ParticipantPanel
participants={participants}
selectedParticipantIds={selectedParticipantIds}
@ -1998,21 +1998,21 @@ const FocusGroupSession = () => {
<div className="flex-1 flex flex-col">
<Tabs defaultValue="chat" value={activeTab} onValueChange={setActiveTab} className="w-full h-full flex flex-col">
<TabsList className="grid grid-cols-4 mb-4">
<TabsTrigger value="chat" className="flex items-center">
<MessageCircle className="h-4 w-4 mr-2" />
Discussion
<TabsTrigger value="chat" className="flex items-center gap-1 sm:gap-2">
<MessageCircle className="h-4 w-4 flex-shrink-0" />
<span className="hidden sm:inline">Discussion</span>
</TabsTrigger>
<TabsTrigger value="themes" className="flex items-center">
<Lightbulb className="h-4 w-4 mr-2" />
Key Themes
<TabsTrigger value="themes" className="flex items-center gap-1 sm:gap-2">
<Lightbulb className="h-4 w-4 flex-shrink-0" />
<span className="hidden sm:inline">Key Themes</span>
</TabsTrigger>
<TabsTrigger value="notes" className="flex items-center">
<StickyNote className="h-4 w-4 mr-2" />
Notes
<TabsTrigger value="notes" className="flex items-center gap-1 sm:gap-2">
<StickyNote className="h-4 w-4 flex-shrink-0" />
<span className="hidden sm:inline">Notes</span>
</TabsTrigger>
<TabsTrigger value="analytics" className="flex items-center">
<BarChart className="h-4 w-4 mr-2" />
Analytics
<TabsTrigger value="analytics" className="flex items-center gap-1 sm:gap-2">
<BarChart className="h-4 w-4 flex-shrink-0" />
<span className="hidden sm:inline">Analytics</span>
</TabsTrigger>
</TabsList>

2
src/pages/MyUsage.tsx
View file

@ -45,7 +45,7 @@ export default function MyUsage() {
<div>
<h2 className="font-display font-semibold text-xl text-foreground mb-4">{t('usage.by_feature')}</h2>
<div className="bg-card border border-border rounded-2xl overflow-hidden">
<div className="bg-card border border-border rounded-2xl overflow-hidden overflow-x-auto">
<Table>
<TableHeader>
<TableRow className="border-border hover:bg-transparent">