mirror of
https://github.com/prowler-cloud/prowler.git
synced 2026-07-24 13:01:56 +00:00
chore: add correct styling
This commit is contained in:
@@ -49,7 +49,7 @@ export const AggregatedComplianceDetail = ({
|
||||
alt={`${compliancetitle} logo`}
|
||||
fill
|
||||
sizes="48px"
|
||||
className="border-border-neutral-secondary bg-bg-neutral-primary rounded-lg border object-contain"
|
||||
className="border-border-neutral-tertiary bg-bg-logo-surface rounded-lg border object-contain"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -54,7 +54,7 @@ export const AggregatedFrameworkCard = ({
|
||||
<div className="flex w-full flex-col gap-3">
|
||||
<div className="flex items-center gap-3">
|
||||
{logo && (
|
||||
<div className="border-border-neutral-secondary bg-bg-neutral-primary flex h-10 w-10 min-w-10 shrink-0 items-center justify-center rounded-md border">
|
||||
<div className="border-border-neutral-tertiary bg-bg-logo-surface flex h-10 w-10 min-w-10 shrink-0 items-center justify-center rounded-md border">
|
||||
<Image
|
||||
src={logo}
|
||||
alt={`${frameworkTitle} logo`}
|
||||
|
||||
@@ -119,7 +119,7 @@ export const ComplianceCard: React.FC<ComplianceCardProps> = ({
|
||||
<div className="flex w-full flex-col gap-3">
|
||||
<div className="flex items-center gap-3 pr-9">
|
||||
{getComplianceIcon(title) && (
|
||||
<div className="flex h-10 w-10 min-w-10 shrink-0 items-center justify-center rounded-md border border-gray-300 bg-white">
|
||||
<div className="border-border-neutral-tertiary bg-bg-logo-surface flex h-10 w-10 min-w-10 shrink-0 items-center justify-center rounded-md border">
|
||||
<Image
|
||||
src={getComplianceIcon(title)}
|
||||
alt={`${title} logo`}
|
||||
|
||||
@@ -86,7 +86,7 @@ export const ComplianceHeader = ({
|
||||
src={logoPath}
|
||||
alt={`${complianceTitle} logo`}
|
||||
fill
|
||||
className="rounded-lg border border-gray-300 bg-white object-contain p-0"
|
||||
className="border-border-neutral-tertiary bg-bg-logo-surface rounded-lg border object-contain p-0"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -135,6 +135,11 @@
|
||||
--bg-fail-primary: var(--color-rose-500);
|
||||
--bg-fail-secondary: var(--color-rose-50);
|
||||
|
||||
/* Surface for third-party brand logos. Intentionally light in both themes:
|
||||
vendor artwork is drawn for a light background and is unreadable on a
|
||||
dark one. Do not swap this for a theme-dependent neutral token. */
|
||||
--bg-logo-surface: var(--color-white);
|
||||
|
||||
/* Data Background Colors */
|
||||
--bg-data-azure: var(--color-sky-400);
|
||||
--bg-data-kubernetes: var(--color-indigo-600);
|
||||
@@ -244,6 +249,9 @@
|
||||
--bg-fail-primary: var(--color-rose-500);
|
||||
--bg-fail-secondary: #432232;
|
||||
|
||||
/* Same value as light on purpose — see the light-theme declaration. */
|
||||
--bg-logo-surface: var(--color-white);
|
||||
|
||||
/* Data Background Colors */
|
||||
--bg-data-azure: var(--color-sky-400);
|
||||
--bg-data-kubernetes: var(--color-indigo-600);
|
||||
@@ -354,6 +362,7 @@
|
||||
--color-bg-warning-secondary: var(--bg-warning-secondary);
|
||||
--color-bg-fail: var(--bg-fail-primary);
|
||||
--color-bg-fail-secondary: var(--bg-fail-secondary);
|
||||
--color-bg-logo-surface: var(--bg-logo-surface);
|
||||
--color-bg-feature-new: var(--bg-feature-new);
|
||||
--color-text-feature-new: var(--text-feature-new);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user