MOPC/MOPC-Portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Onboarding: use ocean background image, show full expertise tag names
All checks were successful
Build and Push Docker Image / build (push) Successful in 9m32s
Details

Browse Source 
- Replace blue gradient with ocean.png background (matches email templates)
- Display expertise tags one per line with full names (no truncation)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Matt
2026-02-17 11:38:26 +01:00
parent d80043c4aa
commit a006c6505c
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/(auth)/onboarding/page.tsx
View File

@@ -221,7 +221,7 @@ export default function OnboardingPage() {
// Show loading while session hydrates or fetching user data // Show loading while session hydrates or fetching user data
if (sessionStatus === 'loading' || userLoading || !initialized) { if (sessionStatus === 'loading' || userLoading || !initialized) {
return ( return (
<div className="absolute inset-0 -m-4 flex items-center justify-center p-4 md:p-8 bg-gradient-to-br from-[#053d57] to-[#557f8c]"> <div className="absolute inset-0 -m-4 flex items-center justify-center p-4 md:p-8 bg-[#053d57] bg-[url('https://s3.monaco-opc.com/public/ocean.png')] bg-cover bg-center bg-no-repeat">
<AnimatedCard> <AnimatedCard>
<Card className="w-full max-w-lg shadow-2xl overflow-hidden"> <Card className="w-full max-w-lg shadow-2xl overflow-hidden">
<div className="h-1 w-full bg-gradient-to-r from-brand-blue via-brand-teal to-brand-blue" /> <div className="h-1 w-full bg-gradient-to-r from-brand-blue via-brand-teal to-brand-blue" />
@@ -236,7 +236,7 @@ export default function OnboardingPage() {
} }
return ( return (
<div className="absolute inset-0 -m-4 flex items-center justify-center p-4 md:p-8 bg-gradient-to-br from-[#053d57] to-[#557f8c]"> <div className="absolute inset-0 -m-4 flex items-center justify-center p-4 md:p-8 bg-[#053d57] bg-[url('https://s3.monaco-opc.com/public/ocean.png')] bg-cover bg-center bg-no-repeat">
<AnimatedCard> <AnimatedCard>
<Card className="w-full max-w-lg max-h-[85vh] overflow-y-auto overflow-hidden shadow-2xl"> <Card className="w-full max-w-lg max-h-[85vh] overflow-y-auto overflow-hidden shadow-2xl">
<div className="h-1 w-full bg-gradient-to-r from-brand-blue via-brand-teal to-brand-blue" /> <div className="h-1 w-full bg-gradient-to-r from-brand-blue via-brand-teal to-brand-blue" />

4
src/components/shared/expertise-select.tsx
View File

@@ -212,7 +212,7 @@ export function ExpertiseSelect({
</button> </button>
{isExpanded && ( {isExpanded && (
<div className="grid grid-cols-1 sm:grid-cols-2 gap-1 p-2"> <div className="grid grid-cols-1 gap-1 p-2">
{categoryTags.map((tag) => { {categoryTags.map((tag) => {
const isSelected = value.includes(tag.name) const isSelected = value.includes(tag.name)
const isLocked = isTagLocked(tag.name) const isLocked = isTagLocked(tag.name)
@@ -261,7 +261,7 @@ export function ExpertiseSelect({
<Check className="h-2 w-2 text-white" /> <Check className="h-2 w-2 text-white" />
))} ))}
</div> </div>
<span className="text-xs truncate">{tag.name}</span> <span className="text-xs">{tag.name}</span>
</Button> </Button>
) )
})} })}