Fixed careermodal buttons for mobile
All checks were successful
ci/woodpecker/manual/woodpecker Pipeline was successful

This commit is contained in:
Josh 2025-09-23 15:01:10 +00:00
parent e2523e9391
commit a2566247fa
2 changed files with 19 additions and 22 deletions

View File

@ -1 +1 @@
ba1c2fbda874bcd3f92bedd8442c050c23d03fb9-372bcf506971f56c4911b429b9f5de5bc37ed008-e9eccd451b778829eb2f2c9752c670b707e1268b 3b3a4e535d5d23a7ef8d6ec6fd65f022a60f3105-372bcf506971f56c4911b429b9f5de5bc37ed008-e9eccd451b778829eb2f2c9752c670b707e1268b

View File

@ -78,30 +78,14 @@ if (!careerDetails || careerDetails.salaryData === undefined) {
</div> </div>
)} )}
{/* Title row */} {/* Title row (title left, actions right) */}
<div className="flex justify-between items-center mb-4 pb-2 border-b"> <div className="mb-4 pb-2 border-b">
<div> <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
<h2 className="text-2xl font-bold text-blue-600"> <h2 className="text-2xl font-bold text-blue-600">
{careerDetails.title} {careerDetails.title}
</h2> </h2>
{/* Buttons (kept on same row as title on sm+, stacked under title on xs) */}
{/* AI RISK SECTION */} <div className="flex gap-2 self-start sm:self-auto">
{aiRisk && aiRisk.riskLevel && aiRisk.reasoning && (
<div className="text-sm text-gray-500 mt-1">
<strong>AI Risk Level:</strong> {aiRisk.riskLevel}
<br />
<span>{aiRisk.reasoning}</span>
</div>
)}
{!aiRisk && (
<p className="text-sm text-gray-500 mt-1">No AI risk data available</p>
)}
</div>
{/* Buttons */}
<div className="flex gap-2">
<button <button
onClick={() => { onClick={() => {
const stabilityRating = calculateStabilityRating( const stabilityRating = calculateStabilityRating(
@ -126,7 +110,20 @@ if (!careerDetails || careerDetails.salaryData === undefined) {
> >
Close Close
</button> </button>
</div>
</div> </div>
{/* AI RISK SECTION (moved below title/actions so it spans full width and doesn't squish) */}
{aiRisk && aiRisk.riskLevel && aiRisk.reasoning && (
<div className="text-sm text-gray-500 mt-2">
<strong>AI Risk Level:</strong> {aiRisk.riskLevel}
<br />
<span>{aiRisk.reasoning}</span>
</div>
)}
{!aiRisk && (
<p className="text-sm text-gray-500 mt-2">No AI risk data available</p>
)}
</div> </div>
{/* Job Description */} {/* Job Description */}