From 3c31c08c374648f38fb089452507ab12a2f58fac Mon Sep 17 00:00:00 2001
From: Bernt Christian Egeland <bernt.christian.egeland@gmail.com>
Date: Wed, 27 Mar 2024 22:46:13 +0100
Subject: [PATCH] flex wrap

---
 src/components/adminPage/users/userInvitation.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/adminPage/users/userInvitation.tsx b/src/components/adminPage/users/userInvitation.tsx
index a0d2bbfe..bf34287d 100644
--- a/src/components/adminPage/users/userInvitation.tsx
+++ b/src/components/adminPage/users/userInvitation.tsx
@@ -117,23 +117,23 @@ const InvitationLink = () => {
 					<p className="pt-5 text-sm text-gray-400">
 						{t("admin.users.authentication.generateInvitation.activeInvitationsLabel")}
 					</p>
-					<div className="flex gap-3">
+					<div className="flex flex-wrap gap-3 ">
 						{invitationLink?.map((invite) => {
 							const expired = new Date(invite.expires) < new Date() || invite?.used;
 							return (
 								<div
 									key={invite.id}
 									onClick={() => showInviationDetails(invite)}
-									className="cursor-pointer"
+									className="cursor-pointer "
 								>
 									<p
-										className={cn("text-md badge", {
-											"bg-primary": !expired,
-											"bg-error": expired,
+										className={cn("text-md badge text-gray-300", {
+											"bg-primary/30": !expired,
+											"bg-error/30": expired,
 										})}
 									>
 										{invite.secret}
-										<span className="pl-1">
+										<span className="pl-1 ">
 											{`${invite.timesUsed}/${invite.timesCanUse || 1}`} --{" "}
 										</span>
 										{`${expired ? "Expired" : "Expires in"}`}