soconnor/hristudio
1
0
Fork 0
mirror of https://github.com/soconnor0919/hristudio.git synced 2026-03-24 03:37:51 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: Implement responsive design for the experiment designer and enhance general UI components with hover effects and shadows.

Browse Source
This commit is contained in:
Sean O'Connor
2026-02-02 12:51:53 -05:00
parent 7fd0d97a67
commit 89c44efcf7
8 changed files with 245 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/(dashboard)/profile/page.tsx
View File

@@ -43,7 +43,7 @@ function ProfileContent({ user }: { user: ProfileUser }) {
{/* Profile Information */}
<div className="space-y-6 lg:col-span-2">
{/* Basic Information */}
<Card>
<Card className="hover:shadow-md transition-shadow duration-200">
<CardHeader>
<CardTitle>Basic Information</CardTitle>
<CardDescription>
@@ -63,7 +63,7 @@ function ProfileContent({ user }: { user: ProfileUser }) {
</Card>
{/* Password Change */}
<Card>
<Card className="hover:shadow-md transition-shadow duration-200">
<CardHeader>
<CardTitle>Password</CardTitle>
<CardDescription>Change your account password</CardDescription>
@@ -116,7 +116,7 @@ function ProfileContent({ user }: { user: ProfileUser }) {
{/* Sidebar */}
<div className="space-y-6">
{/* User Summary */}
<Card>
<Card className="hover:shadow-md transition-shadow duration-200">
<CardHeader>
<CardTitle>Account Summary</CardTitle>
</CardHeader>

4
src/app/(dashboard)/studies/[id]/experiments/[experimentId]/designer/DesignerPageClient.tsx
View File

@@ -56,6 +56,8 @@ export function DesignerPageClient({
]);
return (
<DesignerRoot experimentId={experiment.id} initialDesign={initialDesign} />
<div className="h-[calc(100vh-4rem-2rem)] w-full overflow-hidden border rounded-lg bg-background">
<DesignerRoot experimentId={experiment.id} initialDesign={initialDesign} />
</div>
);
}

4
src/app/dashboard/page.tsx
View File

@@ -185,7 +185,7 @@ export default function DashboardPage() {
) : (
<div className="space-y-4">
{scheduledTrials.map((trial) => (
<div key={trial.id} className="flex items-center justify-between rounded-lg border p-3 hover:bg-muted/50 transition-colors">
<div key={trial.id} className="flex items-center justify-between rounded-lg border p-3 bg-muted/10 hover:bg-muted/50 hover:shadow-sm transition-all duration-200">
<div className="flex items-center gap-4">
<div className="flex h-10 w-10 items-center justify-center rounded-full bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400">
<Calendar className="h-5 w-5" />
@@ -302,7 +302,7 @@ function StatsCard({
trend?: string;
}) {
return (
<Card className="border-muted/40 shadow-sm">
<Card className="border-muted/40 shadow-sm hover:shadow-md transition-all duration-200 hover:border-primary/20">
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className="text-sm font-medium">{title}</CardTitle>
<Icon className="h-4 w-4 text-muted-foreground" />