diff --git a/frontend/src/metabase/query_builder/components/SavedQuestionIntroModal.jsx b/frontend/src/metabase/query_builder/components/SavedQuestionIntroModal.jsx index 077e3f0a6385f20a84c9d248be5ac65c694436c7..c5354587f2870421f18a26d5a128d1789384a860 100644 --- a/frontend/src/metabase/query_builder/components/SavedQuestionIntroModal.jsx +++ b/frontend/src/metabase/query_builder/components/SavedQuestionIntroModal.jsx @@ -1,19 +1,18 @@ import React, { Component } from "react"; import Modal from "metabase/components/Modal"; +import ModalContent from "metabase/components/ModalContent"; import { t } from "ttag"; export default class SavedQuestionIntroModal extends Component { render() { return ( - <Modal small isOpen={this.props.isShowingNewbModal}> - <div className="Modal-content Modal-content--small NewForm"> - <div className="Modal-header"> - <h2 className="pb2 text-dark">{t`It's okay to play around with saved questions`}</h2> - - <div className="pb1 text-medium">{t`You won't make any permanent changes to a saved question unless you click the edit icon in the top-right.`}</div> - </div> - + <Modal isOpen={this.props.isShowingNewbModal}> + <ModalContent + title={t`It's okay to play around with saved questions`} + className="Modal-content text-centered py2" + > + <div className="px2 pb2 text-paragraph">{t`You won't make any permanent changes to a saved question unless you click Save and choose to replace the original question.`}</div> <div className="Form-actions flex justify-center py1"> <button data-metabase-event={"QueryBuilder;IntroModal"} @@ -21,7 +20,7 @@ export default class SavedQuestionIntroModal extends Component { onClick={() => this.props.onClose()} >{t`Okay`}</button> </div> - </div> + </ModalContent> </Modal> ); }