update styles

This commit is contained in:
anovazzi1 2023-04-24 19:03:20 -03:00
commit a15d605cc8
2 changed files with 36 additions and 36 deletions

View file

@ -39,7 +39,7 @@ export default function ButtonBox({
padding = "p-2"; padding = "p-2";
marginTop = "mt-2"; marginTop = "mt-2";
height = "h-36"; height = "h-36";
widht = "w-28"; widht = "w-32";
break; break;
case "medium": case "medium":
bigCircle = "h-16 w-16"; bigCircle = "h-16 w-16";
@ -74,48 +74,48 @@ export default function ButtonBox({
} }
return ( return (
<button disabled={deactivate} onClick={onClick}> <button disabled={deactivate} onClick={onClick}>
<div <Tooltip title={description} placement="bottom">
className={classNames( <div
"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", className={classNames(
bgColor, "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",
height, bgColor,
widht height,
)} widht
> )}
<div className={`flex flex-1 flex-col ${padding}`}> >
<div <div className={`flex flex-1 flex-col ${padding}`}>
className={`mx-auto flex items-center justify-center ${bigCircle} bg-white/30 rounded-full`}
>
<div <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>
</div> <h3
<h3 className={classNames(
className={classNames( "font-semibold text-white",
"font-semibold text-white", titleFontSize,
titleFontSize, marginTop
marginTop )}
)} >
> {title}
{title} </h3>
</h3> <div className="mt-1 flex flex-grow flex-col justify-between">
<div className="mt-1 flex flex-grow flex-col justify-between"> <dt className="sr-only">{title}</dt>
<dt className="sr-only">{title}</dt> {/* <dd
<Tooltip title={description} placement="bottom">
<dd
className={classNames( className={classNames(
"text-gray-100 line-clamp-2", "text-gray-100 line-clamp-2",
descriptionFontSize descriptionFontSize
)} )}
> >
{deactivate ? "Coming soon" : description} {deactivate ? "Coming soon" : description}
</dd> </dd> */}
</Tooltip> </div>
</div> </div>
</div> </div>
</div> </Tooltip>
</button> </button>
); );
} }

View file

@ -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" /> Import <ArrowUpTrayIcon className="w-5 h-5" />
</button> </button>
<button <button
onClick={() =>openPopUp(<ExportModal/>)} 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" /> Export <ArrowDownTrayIcon className="h-5 w-5" />
</button> </button>
<button <button
className="text-gray-400 hover:text-gray-500 " className="text-gray-600 hover:text-gray-500 "
onClick={() => { onClick={() => {
setDark(!dark); setDark(!dark);
}} }}
@ -83,7 +83,7 @@ export default function TabsManagerComponent() {
)} )}
</button> </button>
<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>) => { onClick={(event: React.MouseEvent<HTMLElement>) => {
setNotificationCenter(false); setNotificationCenter(false);
const top = (event.target as Element).getBoundingClientRect().top; const top = (event.target as Element).getBoundingClientRect().top;