diff --git a/.eslintrc.yml b/.eslintrc.yml index 60ea3aa..3949244 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -19,6 +19,8 @@ plugins: rules: prettier/prettier: - error + react/prop-types: + - warn settings: react: version: detect diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index dbb3bd5..f756413 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -3,8 +3,16 @@ name: Node.js CI on: push: branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' pull_request: branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' jobs: ci: diff --git a/.github/workflows/container_build.yml b/.github/workflows/container_build.yml index 59b667f..6990c44 100644 --- a/.github/workflows/container_build.yml +++ b/.github/workflows/container_build.yml @@ -1,9 +1,17 @@ name: Container Build on: push: - branches: [ main ] + branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' pull_request: - branches: [ main ] + branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' jobs: build: diff --git a/.github/workflows/linting.yml b/.github/workflows/linting.yml index 75fd297..eba7610 100644 --- a/.github/workflows/linting.yml +++ b/.github/workflows/linting.yml @@ -3,8 +3,16 @@ name: Yarn Lint on: push: branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' pull_request: branches: [ "main" ] + paths-ignore: + - 'README.md' + - '.devcontainer/**' + - '.github/**' jobs: lint: diff --git a/.stylelintrc.yaml b/.stylelintrc.yaml index 7b81e88..e2d4c42 100644 --- a/.stylelintrc.yaml +++ b/.stylelintrc.yaml @@ -15,8 +15,10 @@ rules: # Disallow CSS classnames prefixed with .pf- or .co- as these prefixes are # reserved by PatternFly and OpenShift console. selector-disallowed-list: - - "*" - - /\.(pf|co)-/ + # Due to a issue with PF: https://github.com/openshift/console/pull/14246 + - null + # - "*" + # - /\.(pf|co)-/ # Plugins should avoid naked element selectors like `table` and `li` since # this can impact layout of existing pages in console. selector-max-type: diff --git a/src/components/missing-pf-styles.css b/src/components/missing-pf-styles.css index 4293b92..46b8502 100644 --- a/src/components/missing-pf-styles.css +++ b/src/components/missing-pf-styles.css @@ -40,92 +40,132 @@ --pf-v5-c-description-list__text--m-help-text--focus--TextDecorationColor: var(--pf-v5-global--Color--100); --pf-v5-c-description-list--m-display-lg__description--FontSize: var(--pf-v5-global--FontSize--lg); --pf-v5-c-description-list--m-display-2xl__description--FontSize: var(--pf-v5-global--FontSize--2xl); + display: grid; grid-template-columns: var(--pf-v5-c-description-list--GridTemplateColumns); row-gap: var(--pf-v5-c-description-list--RowGap); column-gap: var(--pf-v5-c-description-list--ColumnGap); align-items: baseline; } + @media screen and (min-width: 576px) { .pf-v5-c-description-list { --pf-v5-c-description-list__term--Display: var(--pf-v5-c-description-list__term--sm--Display); } } -.pf-v5-c-description-list[class*=pf-m-horizontal] { + +.pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width); } + @media (min-width: 576px) { - .pf-v5-c-description-list[class*=pf-m-horizontal] { + .pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v5-c-description-list--m-horizontal__term--width)); } } + @media (min-width: 768px) { - .pf-v5-c-description-list[class*=pf-m-horizontal] { + .pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width-on-md, var(--pf-v5-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v5-c-description-list--m-horizontal__term--width))); } } + @media (min-width: 992px) { - .pf-v5-c-description-list[class*=pf-m-horizontal] { + .pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v5-c-description-list--m-horizontal__term--width-on-md, var(--pf-v5-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v5-c-description-list--m-horizontal__term--width)))); } } + @media (min-width: 1200px) { - .pf-v5-c-description-list[class*=pf-m-horizontal] { + .pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v5-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v5-c-description-list--m-horizontal__term--width-on-md, var(--pf-v5-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v5-c-description-list--m-horizontal__term--width))))); } } + @media (min-width: 1450px) { - .pf-v5-c-description-list[class*=pf-m-horizontal] { + .pf-v5-c-description-list[class*="pf-m-horizontal"] { --pf-v5-c-description-list__term--width: var(--pf-v5-c-description-list--m-horizontal__term--width-on-2xl, var(--pf-v5-c-description-list--m-horizontal__term--width-on-xl, var(--pf-v5-c-description-list--m-horizontal__term--width-on-lg, var(--pf-v5-c-description-list--m-horizontal__term--width-on-md, var(--pf-v5-c-description-list--m-horizontal__term--width-on-sm, var(--pf-v5-c-description-list--m-horizontal__term--width)))))); } } + .pf-v5-c-description-list.pf-m-inline-grid { display: inline-grid; } + .pf-v5-c-description-list.pf-m-auto-column-widths { --pf-v5-c-description-list--GridTemplateColumns--width: minmax(8ch, max-content); } + .pf-v5-c-description-list.pf-m-auto-fit { grid-template-columns: repeat(auto-fit, minmax(var(--pf-v5-c-description-list--m-auto-fit--GridTemplateColumns--minmax--min), 1fr)); + --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min); } + @media (min-width: 576px) { .pf-v5-c-description-list.pf-m-auto-fit { --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min-on-sm, var(--pf-v5-c-description-list--GridTemplateColumns--min)); } } + @media (min-width: 768px) { .pf-v5-c-description-list.pf-m-auto-fit { --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min-on-md, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-sm, var(--pf-v5-c-description-list--GridTemplateColumns--min))); } } + @media (min-width: 992px) { .pf-v5-c-description-list.pf-m-auto-fit { --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min-on-lg, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-md, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-sm, var(--pf-v5-c-description-list--GridTemplateColumns--min)))); } } + @media (min-width: 1200px) { .pf-v5-c-description-list.pf-m-auto-fit { --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min-on-xl, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-lg, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-md, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-sm, var(--pf-v5-c-description-list--GridTemplateColumns--min))))); } } + @media (min-width: 1450px) { .pf-v5-c-description-list.pf-m-auto-fit { --pf-v5-c-description-list--GridTemplateColumns--minmax--min: var(--pf-v5-c-description-list--GridTemplateColumns--min-on-2xl, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-xl, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-lg, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-md, var(--pf-v5-c-description-list--GridTemplateColumns--min-on-sm, var(--pf-v5-c-description-list--GridTemplateColumns--min)))))); } } + .pf-v5-c-description-list.pf-m-compact { --pf-v5-c-description-list--RowGap: var(--pf-v5-c-description-list--m-compact--RowGap); --pf-v5-c-description-list--ColumnGap: var(--pf-v5-c-description-list--m-compact--ColumnGap); } + .pf-v5-c-description-list.pf-m-fluid { --pf-v5-c-description-list--m-horizontal__term--width: fit-content(20ch); } + +.pf-v5-c-description-list__group, +.pf-v5-c-description-list > .pf-v5-c-card { + display: grid; + grid-template-rows: var(--pf-v5-c-description-list__group--GridTemplateRows); + grid-template-columns: var(--pf-v5-c-description-list__group--GridTemplateColumns); + grid-column: var(--pf-v5-c-description-list__group--GridColumn); + row-gap: var(--pf-v5-c-description-list__group--RowGap); + column-gap: var(--pf-v5-c-description-list__group--ColumnGap); + align-items: baseline; +} + .pf-v5-c-description-list.pf-m-fill-columns { display: block; column-count: var(--pf-v5-c-description-list--GridTemplateColumns--count); margin-block-end: calc(var(--pf-v5-c-description-list--RowGap) * -1); } + +.pf-v5-c-description-list > .pf-v5-c-card { + align-self: stretch; + padding-block-start: var(--pf-v5-c-card--first-child--PaddingTop); + padding-block-end: var(--pf-v5-c-card--child--PaddingBottom); + padding-inline-start: var(--pf-v5-c-card--child--PaddingLeft); + padding-inline-end: var(--pf-v5-c-card--child--PaddingRight); +} + .pf-v5-c-description-list.pf-m-fill-columns .pf-v5-c-description-list__group, .pf-v5-c-description-list.pf-m-fill-columns > .pf-v5-c-card { display: inline-grid; @@ -136,30 +176,14 @@ -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; } + .pf-v5-c-description-list.pf-m-display-lg { --pf-v5-c-description-list__description--FontSize: var(--pf-v5-c-description-list--m-display-lg__description--FontSize); } + .pf-v5-c-description-list.pf-m-display-2xl { --pf-v5-c-description-list__description--FontSize: var(--pf-v5-c-description-list--m-display-2xl__description--FontSize); } -.pf-v5-c-description-list > .pf-v5-c-card { - align-self: stretch; - padding-block-start: var(--pf-v5-c-card--first-child--PaddingTop); - padding-block-end: var(--pf-v5-c-card--child--PaddingBottom); - padding-inline-start: var(--pf-v5-c-card--child--PaddingLeft); - padding-inline-end: var(--pf-v5-c-card--child--PaddingRight); -} - -.pf-v5-c-description-list__group, -.pf-v5-c-description-list > .pf-v5-c-card { - display: grid; - grid-template-rows: var(--pf-v5-c-description-list__group--GridTemplateRows); - grid-template-columns: var(--pf-v5-c-description-list__group--GridTemplateColumns); - grid-column: var(--pf-v5-c-description-list__group--GridColumn); - row-gap: var(--pf-v5-c-description-list__group--RowGap); - column-gap: var(--pf-v5-c-description-list__group--ColumnGap); - align-items: baseline; -} .pf-v5-c-description-list__term, .pf-v5-c-description-list__description { @@ -174,6 +198,11 @@ font-weight: var(--pf-v5-c-description-list__term--FontWeight); line-height: var(--pf-v5-c-description-list__term--LineHeight); } + +.pf-v5-c-description-list__text { + min-width: 0; +} + .pf-v5-c-description-list__term .pf-v5-c-description-list__text { display: inline; } @@ -189,9 +218,6 @@ font-size: var(--pf-v5-c-description-list__description--FontSize, inherit); } -.pf-v5-c-description-list__text { - min-width: 0; -} .pf-v5-c-description-list__text.pf-m-help-text { text-decoration: underline; text-decoration-thickness: var(--pf-v5-c-description-list__text--m-help-text--TextDecorationThickness); @@ -200,9 +226,11 @@ text-underline-offset: var(--pf-v5-c-description-list__text--m-help-text--TextDecorationOffset); cursor: pointer; } + .pf-v5-c-description-list__text.pf-m-help-text:hover { --pf-v5-c-description-list__text--m-help-text--TextDecorationColor: var(--pf-v5-c-description-list__text--m-help-text--hover--TextDecorationColor); } + .pf-v5-c-description-list__text.pf-m-help-text:focus { --pf-v5-c-description-list__text--m-help-text--TextDecorationColor: var(--pf-v5-c-description-list__text--m-help-text--focus--TextDecorationColor); } @@ -210,110 +238,139 @@ .pf-v5-c-description-list.pf-m-1-col { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); } + @media (min-width: 576px) { .pf-v5-c-description-list.pf-m-1-col-on-sm { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col-on-sm { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col-on-sm { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal-on-sm { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical-on-sm { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); } } + @media (min-width: 768px) { .pf-v5-c-description-list.pf-m-1-col-on-md { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col-on-md { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col-on-md { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal-on-md { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical-on-md { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); } } + @media (min-width: 992px) { .pf-v5-c-description-list.pf-m-1-col-on-lg { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col-on-lg { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col-on-lg { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal-on-lg { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical-on-lg { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); } } + @media (min-width: 1200px) { .pf-v5-c-description-list.pf-m-1-col-on-xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col-on-xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col-on-xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal-on-xl { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical-on-xl { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); } } + @media (min-width: 1450px) { .pf-v5-c-description-list.pf-m-1-col-on-2xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-1-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-2-col-on-2xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-2-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-3-col-on-2xl { --pf-v5-c-description-list--GridTemplateColumns--count: var(--pf-v5-c-description-list--m-3-col--GridTemplateColumns--count); } + .pf-v5-c-description-list.pf-m-horizontal-on-2xl { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-horizontal__group--GridTemplateRows); } + .pf-v5-c-description-list.pf-m-vertical-on-2xl { --pf-v5-c-description-list__group--GridTemplateColumns: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateColumns); --pf-v5-c-description-list__group--GridTemplateRows: var(--pf-v5-c-description-list--m-vertical__group--GridTemplateRows); diff --git a/src/components/pod/PodTab.tsx b/src/components/pod/PodTab.tsx index e064b67..d841112 100644 --- a/src/components/pod/PodTab.tsx +++ b/src/components/pod/PodTab.tsx @@ -15,9 +15,9 @@ export default function PodDetails({ obj }) { }, ]; - const detectionsBody = detections.map((d) => { + const detectionsBody = detections.map((d, index) => { return ( - + {d.severity} {d.description} {d.action} diff --git a/src/components/virt/DetectionsTable.tsx b/src/components/virt/DetectionsTable.tsx index 178fa41..b40251d 100644 --- a/src/components/virt/DetectionsTable.tsx +++ b/src/components/virt/DetectionsTable.tsx @@ -85,7 +85,7 @@ export default function DetectionsTable({ client, deviceId, alerts, setAlerts }) {alerts.map((a) => { return ( - + toggle(a.compositeId)} @@ -94,12 +94,18 @@ export default function DetectionsTable({ client, deviceId, alerts, setAlerts }) /> {a.description}, - {a.tactic}, - + + {a.description} + , + + {a.tactic} + , + , - {a.timestamp.toUTCString()}, + + {a.timestamp.toUTCString()} + , ]} />

- We couldn't find a running Falcon agent that matches this system's MAC address. If the - agent is installed, make sure the falcon-sensor service is running. + We couldn't find a running Falcon agent that matches this system's MAC address. + If the agent is installed, make sure the falcon-sensor service is running.

diff --git a/src/components/virt/VulnsTable.tsx b/src/components/virt/VulnsTable.tsx index 1f5d513..7cb098c 100644 --- a/src/components/virt/VulnsTable.tsx +++ b/src/components/virt/VulnsTable.tsx @@ -120,7 +120,7 @@ export default function VulnsTable({ client, deviceId, vulns, setVulns }) { {sortedRemediations.map((r) => { return ( - + toggle(r.id)} @@ -129,9 +129,13 @@ export default function VulnsTable({ client, deviceId, vulns, setVulns }) { /> {r.action}
, - {r.maxBaseScore}, - + + {r.action} + , + + {r.maxBaseScore} + , + {r.cves.map((c) => { return ( - + {c.id} {c.baseScore} diff --git a/src/components/virt/style.css b/src/components/virt/style.css index 58b31d4..c5f48bd 100644 --- a/src/components/virt/style.css +++ b/src/components/virt/style.css @@ -8,7 +8,7 @@ ul.crwd-process-tree-child { } ul.crwd-process-tree-child li::marker { - color: #8A8D90; + color: var(--pf-global--Color--400); } ul.crwd-process-tree-root pre, ul.crwd-process-tree-child pre { @@ -16,7 +16,7 @@ ul.crwd-process-tree-root pre, ul.crwd-process-tree-child pre { } ul.crwd-process-tree-root li, ul.crwd-process-tree-child li { - padding: 5px 0px 0px 5px; + padding: 5px 0 0 5px; } div.crwd-card-title {