diff --git a/ui/src/Components/CenteredMessage/index.js b/ui/src/Components/CenteredMessage/index.js new file mode 100644 index 000000000..4cea9a1a0 --- /dev/null +++ b/ui/src/Components/CenteredMessage/index.js @@ -0,0 +1,15 @@ +import React from "react"; + +import { MountFade } from "Components/Animations/MountFade"; + +const CenteredMessage = ({ children, className }) => ( +

+ {children} +

+); + +export { CenteredMessage }; diff --git a/ui/src/Components/Grid/EmptyGrid/index.js b/ui/src/Components/Grid/EmptyGrid/index.js index 9e4765f36..4df43a9af 100644 --- a/ui/src/Components/Grid/EmptyGrid/index.js +++ b/ui/src/Components/Grid/EmptyGrid/index.js @@ -3,16 +3,12 @@ import React from "react"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faMugHot } from "@fortawesome/free-solid-svg-icons/faMugHot"; -import { MountFade } from "Components/Animations/MountFade"; - -import "./index.scss"; +import { CenteredMessage } from "Components/CenteredMessage"; const EmptyGrid = () => ( -

- - - -

+ + + ); export { EmptyGrid }; diff --git a/ui/src/Components/Grid/EmptyGrid/index.scss b/ui/src/Styles/Components/CenteredMessage.scss similarity index 100% rename from ui/src/Components/Grid/EmptyGrid/index.scss rename to ui/src/Styles/Components/CenteredMessage.scss diff --git a/ui/src/Styles/DarkTheme.scss b/ui/src/Styles/DarkTheme.scss index a3060ebc1..42150504e 100644 --- a/ui/src/Styles/DarkTheme.scss +++ b/ui/src/Styles/DarkTheme.scss @@ -83,6 +83,7 @@ $datepicker__day-hover-color: $white; @import "Styles/Components/Alert"; @import "Styles/Components/AlertGroup"; @import "Styles/Components/BaseLabel"; +@import "Styles/Components/CenteredMessage"; @import "Styles/Components/FilterInputLabel"; @import "Styles/Components/LabelWithPercent"; @import "Styles/Components/InputRange"; diff --git a/ui/src/Styles/LightTheme.scss b/ui/src/Styles/LightTheme.scss index 73e292226..54073aa51 100644 --- a/ui/src/Styles/LightTheme.scss +++ b/ui/src/Styles/LightTheme.scss @@ -74,6 +74,7 @@ $datepicker__day-hover-color: $black; @import "Styles/Components/Alert"; @import "Styles/Components/AlertGroup"; @import "Styles/Components/BaseLabel"; +@import "Styles/Components/CenteredMessage"; @import "Styles/Components/FilterInputLabel"; @import "Styles/Components/LabelWithPercent"; @import "Styles/Components/InputRange";