diff --git a/frontend/pages/queries/QueryPage/QueryPage.jsx b/frontend/pages/queries/QueryPage/QueryPage.jsx index 6f1680b856..9af1f8e996 100644 --- a/frontend/pages/queries/QueryPage/QueryPage.jsx +++ b/frontend/pages/queries/QueryPage/QueryPage.jsx @@ -539,11 +539,14 @@ export class QueryPage extends Component { return false; } - const message = `Live query disabled due to error: ${liveQueryError}`; - return ( - {message} +

+ Live query request failed +

+

+ Error: {liveQueryError} +

); }; diff --git a/frontend/pages/queries/QueryPage/_styles.scss b/frontend/pages/queries/QueryPage/_styles.scss index 85880013fe..5edbce72c5 100644 --- a/frontend/pages/queries/QueryPage/_styles.scss +++ b/frontend/pages/queries/QueryPage/_styles.scss @@ -13,10 +13,6 @@ min-height: 400px; } - &__warning { - margin: 0; - } - &__content { display: flex; flex-direction: column; @@ -24,6 +20,25 @@ margin-bottom: $pad-medium; } + &__warning { + margin: $pad-xlarge; + margin-bottom: 0; + + &-title { + font-size: $small; + font-weight: $bold; + margin: 0; + } + + span { + font-weight: $bold; + } + p { + margin: 0; + margin-top: $pad-xsmall; + } + } + &__observer-query-view { width: 90%; max-width: 1060px;