Patternfly QuickStart CSS is skewing icon

[abhinandan13jan]

This piece of CSS is causing this issue -> Catalog tile Icon is skewed (https://bugzilla.redhat.com/show_bug.cgi?id=2029977)

Filename: quickstarts.min.css
.catalog-tile-pf-icon { //from patternfly quickStarts
    font-size: 40px;
    height: 40px;
    max-width: 60px;
    min-width: 40px;
}

instead of

img is constrained on both width and height which should not happen

[jschuler]

This CSS is coming from the patternfly-react repo. I've reopened your issue here
patternfly/react-catalog-view#19

One thing you can do if you don't want to load the catalog css twice, you can import just the base CSS from quickstarts this way:

import '@patternfly/quickstarts/dist/quickstarts-base.css'

The normal @patternfly/quickstarts/dist/quickstarts.css file is a combination of the above plus dist/quickstarts-vendor.css which contains styles from:

@import '@patternfly/react-catalog-view-extension/dist/sass/react-catalog-view-extension.scss';
@import '@patternfly/patternfly/components/ClipboardCopy/clipboard-copy.scss';
@import '@patternfly/patternfly/components/CodeBlock/code-block.scss';