Apply padding to Alert component.

This commit is contained in:
Kia Lam 2019-03-14 10:35:54 -04:00
parent 6bd5ee4201
commit 518ecee53e
No known key found for this signature in database
GPG Key ID: 294F9BE53C241D03
2 changed files with 25 additions and 9 deletions

View File

@ -258,14 +258,24 @@
position: relative;
}
// PF Alert notification component overrides
.pf-c-alert__title {
--pf-c-alert__title--PaddingTop: 20px;
--pf-c-alert__title--PaddingRight: 20px;
--pf-c-alert__title--PaddingBottom: 20px;
--pf-c-alert__title--PaddingLeft: 20px;
}
.pf-c-alert__description {
--pf-c-alert__description--PaddingRight: 20px;
--pf-c-alert__description--PaddingBottom: 20px;
--pf-c-alert__description--PaddingLeft: 20px;
}
.pf-c-alert {
position: absolute;
width: 100%;
z-index: 20;
button {
margin-right: 20px;
}
}
.pf-c-alert__icon {
@ -281,4 +291,14 @@
height: 24px;
margin-right: 10px;
margin-bottom: 10px;
}
.awx-c-form-action-group {
float: right;
display: block;
.pf-m-danger {
margin-top: 20px;
margin-right: 20px;
}
}

View File

@ -45,10 +45,6 @@ const hiddenStyle = {
display: 'none',
};
const buttonGroupStyle = {
float: 'right',
};
const Detail = ({ label, value, url, customStyles }) => {
let detail = null;
if (value) {
@ -335,7 +331,7 @@ class OrganizationAccessList extends React.Component {
action={<AlertActionCloseButton onClose={this.hideWarning} />}
>
{warningMsg}
<span style={buttonGroupStyle}>
<span className="awx-c-form-action-group">
<Button variant="danger" aria-label="confirm-delete" onClick={this.confirmDelete}>Delete</Button>
<Button variant="secondary" onClick={this.hideWarning}>Cancel</Button>
</span>