From a15d605cc82f56e27e876f426210f873c84b892c Mon Sep 17 00:00:00 2001
From: anovazzi1 <otavio2204@gmail.com>
Date: Mon, 24 Apr 2023 19:03:20 -0300
Subject: [PATCH] update styles

---
 .../modals/importModal/buttonBox/index.tsx    | 64 +++++++++----------
 .../components/tabsManagerComponent/index.tsx |  8 +--
 2 files changed, 36 insertions(+), 36 deletions(-)

diff --git a/src/frontend/src/modals/importModal/buttonBox/index.tsx b/src/frontend/src/modals/importModal/buttonBox/index.tsx
index e9d59b751..b0757cdae 100644
--- a/src/frontend/src/modals/importModal/buttonBox/index.tsx
+++ b/src/frontend/src/modals/importModal/buttonBox/index.tsx
@@ -39,7 +39,7 @@ export default function ButtonBox({
 			padding = "p-2";
 			marginTop = "mt-2";
 			height = "h-36";
-			widht = "w-28";
+			widht = "w-32";
 			break;
 		case "medium":
 			bigCircle = "h-16 w-16";
@@ -74,48 +74,48 @@ export default function ButtonBox({
 	}
 	return (
 		<button disabled={deactivate} onClick={onClick}>
-			<div
-				className={classNames(
-					"col-span-1 flex flex-col divide-y divide-gray-200 rounded-lg text-center shadow border border-gray-300 hover:shadow-lg transform hover:scale-105",
-					bgColor,
-					height,
-					widht
-				)}
-			>
-				<div className={`flex flex-1 flex-col ${padding}`}>
-					<div
-						className={`mx-auto flex items-center justify-center ${bigCircle} bg-white/30 rounded-full`}
-					>
+			<Tooltip title={description} placement="bottom">
+				<div
+					className={classNames(
+						"col-span-1 flex flex-col  divide-y divide-gray-200 rounded-lg text-center shadow border border-gray-300 hover:shadow-lg transform hover:scale-105",
+						bgColor,
+						height,
+						widht
+					)}
+				>
+					<div className={`flex flex-1 flex-col ${padding}`}>
 						<div
-							className={`mx-auto flex items-center justify-center ${smallCircle} bg-white rounded-full`}
+							className={`mx-auto flex items-center justify-center ${bigCircle} bg-white/30 rounded-full`}
 						>
-							<div className={textColor}>{icon}</div>
+							<div
+								className={`mx-auto flex items-center justify-center ${smallCircle} bg-white rounded-full`}
+							>
+								<div className={textColor}>{icon}</div>
+							</div>
 						</div>
-					</div>
-					<h3
-						className={classNames(
-							"font-semibold text-white",
-							titleFontSize,
-							marginTop
-						)}
-					>
-						{title}
-					</h3>
-					<div className="mt-1 flex flex-grow flex-col justify-between">
-						<dt className="sr-only">{title}</dt>
-						<Tooltip title={description} placement="bottom">
-							<dd
+						<h3
+							className={classNames(
+								"font-semibold text-white",
+								titleFontSize,
+								marginTop
+							)}
+						>
+							{title}
+						</h3>
+						<div className="mt-1 flex flex-grow flex-col justify-between">
+							<dt className="sr-only">{title}</dt>
+							{/* <dd
 								className={classNames(
 									"text-gray-100 line-clamp-2",
 									descriptionFontSize
 								)}
 							>
 								{deactivate ? "Coming soon" : description}
-							</dd>
-						</Tooltip>
+							</dd> */}
+						</div>
 					</div>
 				</div>
-			</div>
+			</Tooltip>
 		</button>
 	);
 }
diff --git a/src/frontend/src/pages/FlowPage/components/tabsManagerComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/tabsManagerComponent/index.tsx
index 71c964cbe..6d7a4d844 100644
--- a/src/frontend/src/pages/FlowPage/components/tabsManagerComponent/index.tsx
+++ b/src/frontend/src/pages/FlowPage/components/tabsManagerComponent/index.tsx
@@ -60,18 +60,18 @@ export default function TabsManagerComponent() {
 								/>
 							)
 						}
-						className="flex items-center gap-1 pr-2 border-gray-400 border-r text-sm text-gray-400 hover:text-gray-500"
+						className="flex items-center gap-1 pr-2 border-gray-400 border-r text-sm text-gray-600 hover:text-gray-500"
 					>
 						Import <ArrowUpTrayIcon className="w-5 h-5" />
 					</button>
 					<button
 						onClick={() =>openPopUp(<ExportModal/>)}
-						className="flex items-center gap-1 mr-2 text-sm text-gray-400 hover:text-gray-500"
+						className="flex items-center gap-1 mr-2 text-sm text-gray-600 hover:text-gray-500"
 					>
 						Export <ArrowDownTrayIcon className="h-5 w-5" />
 					</button>
 					<button
-						className="text-gray-400 hover:text-gray-500 "
+						className="text-gray-600 hover:text-gray-500 "
 						onClick={() => {
 							setDark(!dark);
 						}}
@@ -83,7 +83,7 @@ export default function TabsManagerComponent() {
 						)}
 					</button>
 					<button
-						className="text-gray-400 hover:text-gray-500 relative"
+						className="text-gray-600 hover:text-gray-500 relative"
 						onClick={(event: React.MouseEvent<HTMLElement>) => {
 							setNotificationCenter(false);
 							const top = (event.target as Element).getBoundingClientRect().top;