diff --git a/frontend/components/flash_messages/FlashMessage/FlashMessage.jsx b/frontend/components/flash_messages/FlashMessage/FlashMessage.jsx index 3cf9452840..310e9bf946 100644 --- a/frontend/components/flash_messages/FlashMessage/FlashMessage.jsx +++ b/frontend/components/flash_messages/FlashMessage/FlashMessage.jsx @@ -6,6 +6,8 @@ import notificationInterface from "interfaces/notification"; import FleetIcon from "components/icons/FleetIcon"; import Button from "components/buttons/Button"; +import CloseIcon from "../../../../assets/images/icon-close-fleet-blue-16x16@2x.png"; + const baseClass = "flash-message"; const FlashMessage = ({ @@ -42,11 +44,12 @@ const FlashMessage = ({
-
diff --git a/frontend/components/flash_messages/FlashMessage/_styles.scss b/frontend/components/flash_messages/FlashMessage/_styles.scss index 1ce439056b..e501b4bd09 100644 --- a/frontend/components/flash_messages/FlashMessage/_styles.scss +++ b/frontend/components/flash_messages/FlashMessage/_styles.scss @@ -17,7 +17,7 @@ align-items: center; justify-content: center; color: $core-fleet-blue; - padding: 0 $pad-small 0 $pad-medium; + padding: $pad-small $pad-medium; z-index: 3; background-color: $core-white; margin: auto; @@ -39,13 +39,14 @@ } &__content { - flex-grow: 1; - text-align: center; + display: flex; + align-items: center; span { margin-left: 15px; margin-right: 15px; font-size: $small; + white-space: nowrap; } .fleeticon { @@ -59,14 +60,12 @@ font-size: $small; text-decoration: underline; text-transform: uppercase; + margin-right: 15px; } &__remove { - @include size(30px); + height: auto; cursor: pointer; - text-align: center; - margin-left: 15px; - height: 37px; .fleeticon { transition: color 150ms ease-in-out; @@ -82,17 +81,14 @@ &__ex { text-decoration: none; - .button::after { - content: url("../assets/images/icon-close-fleet-blue-16x16@2x.png"); - transform: scale(0.5); - border-radius: 0px; - z-index: 4; - } + button { + display: flex; + align-items: center; - .button:hover::after { - content: url("../assets/images/icon-close-vibrant-blue-16x16@2x.png"); - transform: scale(0.5); - border-radius: 0px; + img { + height: 16px; + width: 16px; + } } } } diff --git a/frontend/pages/admin/AppSettingsPage/AppSettingsPage.jsx b/frontend/pages/admin/AppSettingsPage/AppSettingsPage.jsx index bd9b98b649..54ad40e090 100644 --- a/frontend/pages/admin/AppSettingsPage/AppSettingsPage.jsx +++ b/frontend/pages/admin/AppSettingsPage/AppSettingsPage.jsx @@ -26,7 +26,7 @@ class AppSettingsPage extends Component { dispatch(updateConfig(diff)) .then(() => { - dispatch(renderFlash("success", "Settings updated!")); + dispatch(renderFlash("success", "Settings updated.")); return false; }) @@ -38,7 +38,6 @@ class AppSettingsPage extends Component { return false; }); - window.scrollTo(0, 0); return false; }; diff --git a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx index 1cb80752e4..820fdd35a3 100644 --- a/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx +++ b/frontend/pages/admin/TeamManagementPage/TeamDetailsWrapper/AgentOptionsPage/AgentOptionsPage.tsx @@ -61,7 +61,6 @@ const AgentOptionsPage = (props: IAgentOptionsPageProps): JSX.Element => { ) .then(() => { dispatch(renderFlash("success", "Successfully saved agent options")); - window.scrollTo(0, 0); }) .catch((errors: { [key: string]: any }) => { dispatch(renderFlash("error", errors.stack)); diff --git a/frontend/pages/admin/UserManagementPage/UserManagementPage.jsx b/frontend/pages/admin/UserManagementPage/UserManagementPage.jsx index 6d752d2a27..54b83a8778 100644 --- a/frontend/pages/admin/UserManagementPage/UserManagementPage.jsx +++ b/frontend/pages/admin/UserManagementPage/UserManagementPage.jsx @@ -110,7 +110,6 @@ export class UserManagementPage extends Component { renderFlash("success", `Successfully edited ${userEditing?.name}`) ); toggleEditUserModal(); - window.scrollTo(0, 0); }) .catch(() => { dispatch( @@ -120,7 +119,6 @@ export class UserManagementPage extends Component { ) ); toggleEditUserModal(); - window.scrollTo(0, 0); }); } @@ -134,7 +132,6 @@ export class UserManagementPage extends Component { .then(() => { dispatch(renderFlash("success", userUpdatedFlashMessage)); toggleEditUserModal(); - window.scrollTo(0, 0); }) .catch(() => { dispatch( @@ -144,12 +141,11 @@ export class UserManagementPage extends Component { ) ); toggleEditUserModal(); - window.scrollTo(0, 0); }); }; onCreateUserSubmit = (formData) => { - const { dispatch } = this.props; + const { dispatch, config } = this.props; // Do some data formatting adding `invited_by` for the request to be correct. const requestData = { ...formData, @@ -159,17 +155,18 @@ export class UserManagementPage extends Component { dispatch(inviteActions.create(requestData)) .then(() => { dispatch( - renderFlash("success", `Successfully created ${formData.name}.`) + renderFlash( + "success", + `An invitation email was sent from ${config.sender_address} to ${formData.email}.` + ) ); this.toggleCreateUserModal(); - window.scrollTo(0, 0); }) .catch(() => { dispatch( renderFlash("error", "Could not create user. Please try again.") ); this.toggleCreateUserModal(); - window.scrollTo(0, 0); }); }; @@ -189,7 +186,6 @@ export class UserManagementPage extends Component { dispatch( renderFlash("success", `Successfully deleted ${userEditing?.name}.`) ); - window.scrollTo(0, 0); }) .catch(() => { dispatch( @@ -198,7 +194,6 @@ export class UserManagementPage extends Component { `Could not delete ${userEditing?.name}. Please try again.` ) ); - window.scrollTo(0, 0); }); toggleDeleteUserModal(); } else { @@ -214,7 +209,6 @@ export class UserManagementPage extends Component { ) ); }); - window.scrollTo(0, 0); toggleDeleteUserModal(); } }; diff --git a/frontend/pages/packs/EditPackPage/EditPackPage.jsx b/frontend/pages/packs/EditPackPage/EditPackPage.jsx index fe2400d1a7..7cfb7dc6a5 100644 --- a/frontend/pages/packs/EditPackPage/EditPackPage.jsx +++ b/frontend/pages/packs/EditPackPage/EditPackPage.jsx @@ -189,13 +189,11 @@ export class EditPackPage extends Component { .then(() => { this.setState({ selectedScheduledQuery: null, selectedQuery: null }); dispatch(renderFlash("success", "Scheduled Query updated!")); - window.scrollTo(0, 0); }) .catch(() => { dispatch( renderFlash("error", "Unable to update your Scheduled Query.") ); - window.scrollTo(0, 0); }); }; @@ -218,7 +216,6 @@ export class EditPackPage extends Component { return Promise.all(promises).then(() => { this.setState({ selectedScheduledQuery: null, selectedQuery: null }); dispatch(renderFlash("success", "Scheduled queries removed")); - window.scrollTo(0, 0); }); }; @@ -233,7 +230,6 @@ export class EditPackPage extends Component { dispatch(create(scheduledQueryData)).catch(() => { dispatch(renderFlash("error", "Unable to schedule your query.")); }); - window.scrollTo(0, 0); return false; }; diff --git a/frontend/pages/queries/QueryPage/QueryPage.jsx b/frontend/pages/queries/QueryPage/QueryPage.jsx index 6788929ff9..cc498151fb 100644 --- a/frontend/pages/queries/QueryPage/QueryPage.jsx +++ b/frontend/pages/queries/QueryPage/QueryPage.jsx @@ -401,7 +401,6 @@ export class QueryPage extends Component { window, } = global; const { queryResultsToggle, queryPosition } = this.state; - window.scrollTo(0, 0); const { parentNode: { parentNode: parent }, } = evt.currentTarget;