junte/assessment-model
1
0
Fork 0
mirror of https://github.com/Hestia-Homes/assessment-model.git synced 2026-06-08 11:37:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

capitalized S in scoping, centered the badge on the card, lined up the badge regardless of length of text and trying to get the text to provide contrast on hover

Browse source
This commit is contained in:
StefanWout 2024-09-06 12:56:49 +01:00
parent 933d219fbf
commit e3f0fd6d94
2 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/app/components/StatusBadge.tsx
View file

@ -50,7 +50,7 @@ const statusColor: {
} = {
scoping: {
class: "bg-emerald-500 hover:bg-emerald-500",
text: "scoping",
text: "Scoping",
hoverText: "This portfolio is currently in scoping",
propertyHoverText: "This property is currently in scoping",
},

8
src/app/components/home/Card.tsx
View file

@ -10,10 +10,10 @@ const styles = {
wrapper:
"active:bg-brandmidblue font-medium leading-none text-base tracking-wider text-gray-400 hover:text-gray-300 bg-white hover:bg-hoverblue shadow-xl hover:shadow-none cursor-pointer w-60 h-80 rounded-3xl flex flex-col items-center justify-center",
header: "relative mt-2 mx-2 border-red",
imageWrapper: "h-56 rounded-2xl overflow-hidden flex items-center",
imageWrapper: "h-52 rounded-2xl overflow-hidden flex items-center",
wrapperAnime: "transition-all duration-500 ease-in-out",
image: "object-cover mx-auto",
textWrapper: "pt-3 pb-3 w-full px-4 flex justify-center items-center max-h-16 my-auto text-red-500 text-center",
textWrapper: "pb-3 w-full px-4 flex justify-center items-center max-h-16 my-auto text-gray-700 text-center",
};
interface CardProps {
@ -54,8 +54,8 @@ const Card = ({ id, title, image, budget, status }: CardProps) => {
<h1>{`${title}`}</h1>
<div>{budgetFormatted}</div>
</div>
<div className="mb-2 flex justify-end w-full">
<div className="flex justify-end w-full pr-4">
<div className="mb-4 flex justify-end w-full">
<div className="flex justify-center w-full">
<StatusBadge status={status} />
</div>
</div>