diff --git a/src/app.scss b/src/app.scss index 393c1ac3f6..48e43d0421 100644 --- a/src/app.scss +++ b/src/app.scss @@ -1,3 +1,8 @@ +// https://github.com/patternfly/patternfly-react/issues/1294 +#app { + height: 100%; +} + // // masthead overrides // @@ -44,7 +49,6 @@ } .pf-c-nav__simple-list .pf-c-nav__link { - --pf-c-nav__simple-list-link--PaddingLeft: 24px; --pf-c-nav__simple-list-link--PaddingBottom: 6px; --pf-c-nav__simple-list-link--PaddingTop: 6px; } @@ -70,16 +74,6 @@ padding-bottom: 10px; } -// -// toolbar overrides -// - -.pf-l-toolbar { - align-self: center; - height: 60px; -} - - // // data list overrides // @@ -99,7 +93,7 @@ .pf-c-data-list__item { --pf-c-data-list__item--PaddingLeft: 20px; - --pf-c-data-list__item--PaddingRight: 0px; + --pf-c-data-list__item--PaddingRight: 20px; } .pf-c-data-list__check { @@ -116,8 +110,24 @@ margin-right: 20px; } -.pf-c-data-list__cell a { - margin-right: 8px; +.pf-c-data-list__cell { + --pf-c-data-list__cell--PaddingTop: 16px; + --pf-c-data-list__cell--PaddingBottom: 16px; + --pf-c-data-list__cell-cell--PaddingTop: 16px; + + a { + margin-right: 8px; + } +} + +// +// switch overrides +// +// https://github.com/patternfly/patternfly-next/issues/915 +.pf-c-switch { + .pf-c-switch__label::before { + display: none; + } } // @@ -143,19 +153,15 @@ } } -// -// data list overrides -// - -.pf-c-data-list__item { - --pf-c-data-list__item--PaddingLeft: 20px; - --pf-c-data-list__item--PaddingRight: 20px; -} - // // pf modal overrides // +.pf-c-modal-box { + --pf-c-modal-box--Width: 550px; + --pf-c-modal-box--MaxWidth: 550px; +} + .pf-c-modal-box__footer { --pf-c-modal-box__footer--PaddingTop: 20px; --pf-c-modal-box__footer--PaddingRight: 20px; @@ -189,6 +195,10 @@ padding: 0; } +.pf-c-card__body { + --pf-c-card__body--PaddingTop: 24px; +} + // // pf empty state overrides // @@ -205,11 +215,10 @@ .awx-lookup { min-height: 36px; -} -.awx-c-modal { - width: 550px; - margin: 0; + .pf-c-form-control { + --pf-c-form-control--Height: auto; + } } .awx-c-icon--remove { diff --git a/src/components/DataListToolbar/styles.scss b/src/components/DataListToolbar/styles.scss index 535d6aacaf..23ec65dba8 100644 --- a/src/components/DataListToolbar/styles.scss +++ b/src/components/DataListToolbar/styles.scss @@ -5,6 +5,7 @@ border-bottom: var(--awx-toolbar--BorderWidth) solid var(--awx-toolbar--BorderColor); background-color: var(--awx-toolbar--BackgroundColor); + display: flex; height: 70px; padding-top: 5px; @@ -13,6 +14,10 @@ --pf-global--FontSize--md: 14px; } +.awx-toolbar .pf-l-level { + flex: 1; +} + .awx-toolbar .pf-c-button.pf-m-plain { --pf-c-button--m-plain--PaddingLeft: 0px; --pf-c-button--m-plain--PaddingRight: 0px; @@ -43,6 +48,7 @@ height: 30px; input { + height: 30px; padding: 0 10px; width: 300px; } @@ -60,6 +66,10 @@ padding: 0 10px; margin: 0px; + .pf-c-dropdown__toggle-text { + width: auto; + } + .pf-c-dropdown__toggle-icon { margin: 0px; padding-top: 3px; diff --git a/src/components/Lookup/Lookup.jsx b/src/components/Lookup/Lookup.jsx index 0dbfc59813..4ccc673d7e 100644 --- a/src/components/Lookup/Lookup.jsx +++ b/src/components/Lookup/Lookup.jsx @@ -136,7 +136,6 @@ class Lookup extends React.Component {