minor style updates

This commit is contained in:
Vladyslav Matsiiako
2023-06-25 21:49:28 -07:00
parent 7c77cc4ea4
commit 6959fc52ac
5 changed files with 5 additions and 5 deletions
@@ -11,7 +11,7 @@ export type FormLabelProps = {
}; };
export const FormLabel = ({ id, label, isRequired }: FormLabelProps) => ( export const FormLabel = ({ id, label, isRequired }: FormLabelProps) => (
<Label.Root className="mb-1 ml-0.5 block text-sm font-medium text-mineshaft-300" htmlFor={id}> <Label.Root className="mb-0.5 ml-1 block text-sm font-normal text-mineshaft-400" htmlFor={id}>
{label} {label}
{isRequired && <span className="ml-1 text-red">*</span>} {isRequired && <span className="ml-1 text-red">*</span>}
</Label.Root> </Label.Root>
@@ -179,7 +179,7 @@ export const IntegrationsPage = ({ frameworkIntegrations }: Props) => {
}; };
return ( return (
<div className="container mx-auto px-8 pb-12 text-white"> <div className="container mr-auto pb-12 text-white">
<NavHeader pageName={t("integrations.title")} isProjectRelated /> <NavHeader pageName={t("integrations.title")} isProjectRelated />
<IntegrationsSection <IntegrationsSection
isLoading={isIntegrationLoading} isLoading={isIntegrationLoading}
@@ -84,7 +84,7 @@ export const CloudIntegrationSection = ({
Boolean(integrationAuths?.[cloudIntegration.slug]) && ( Boolean(integrationAuths?.[cloudIntegration.slug]) && (
<div className="absolute top-0 right-0 z-40 h-full"> <div className="absolute top-0 right-0 z-40 h-full">
<div className="relative h-full"> <div className="relative h-full">
<div className="absolute top-0 right-0 w-24 flex-row items-center overflow-hidden whitespace-nowrap rounded-tr-md bg-primary py-0.5 px-2 text-xs text-black opacity-80 transition-all duration-300 group-hover:w-0 group-hover:p-0"> <div className="absolute top-0 right-0 w-24 flex-row items-center overflow-hidden whitespace-nowrap rounded-tr-md rounded-bl-md bg-primary py-0.5 px-2 text-xs text-black opacity-80 transition-all duration-300 group-hover:w-0 group-hover:p-0">
<FontAwesomeIcon icon={faCheck} className="mr-2 text-xs" /> <FontAwesomeIcon icon={faCheck} className="mr-2 text-xs" />
Authorized Authorized
</div> </div>
@@ -19,7 +19,7 @@ export const FrameworkIntegrationSection = ({ frameworks }: Props) => {
<p className="text-base text-gray-400">{t("integrations.click-to-setup")}</p> <p className="text-base text-gray-400">{t("integrations.click-to-setup")}</p>
</div> </div>
<div <div
className="mx-6 mt-4 grid grid-flow-dense gap-4" className="mx-6 mt-4 grid grid-flow-dense gap-3"
style={{ gridTemplateColumns: "repeat(auto-fill, minmax(120px, 1fr))" }} style={{ gridTemplateColumns: "repeat(auto-fill, minmax(120px, 1fr))" }}
> >
{frameworks.map((framework) => ( {frameworks.map((framework) => (
@@ -45,7 +45,7 @@ export const IntegrationsSection = ({
)} )}
{!isLoading && !integrations.length && ( {!isLoading && !integrations.length && (
<EmptyState <EmptyState
className="mx-6 py-8" className="mx-6 pt-8 pb-4 rounded-md border border-mineshaft-700"
title="No integrations found. Click on one of the below providers to sync secrets." title="No integrations found. Click on one of the below providers to sync secrets."
/> />
)} )}