Commit 123b186e authored by Eric Rosenbaum's avatar Eric Rosenbaum

display password error tooltip inside modal

parent 7df59213
......@@ -100,6 +100,7 @@
"studio.transfer.confirmWithPassword": "To confirm changing the studio host, please enter your password.",
"studio.transfer.forgotPassword": "Forgot password?",
"studio.transfer.alert.somethingWentWrong": "Something went wrong transferring this studio to a new host.",
"studio.transfer.alert.wasntTheRightPassword": "Hmm, that wasn’t the right password.",
"studio.remove": "Remove",
"studio.promote": "Promote",
......
......@@ -7,6 +7,7 @@ import ModalInnerContent from '../../../components/modal/base/modal-inner-conten
import TransferHostTile from './transfer-host-tile.jsx';
import Form from '../../../components/forms/form.jsx';
import ValidationMessage from '../../../components/forms/validation-message.jsx';
import {managers} from '../lib/redux-modules';
......@@ -73,6 +74,7 @@ const TransferHostConfirmation = ({
className="transfer-form"
onSubmit={handleSubmit} // eslint-disable-line react/jsx-no-bind
>
<div className="transfer-password-row">
<input
className="transfer-password-input"
required
......@@ -82,6 +84,12 @@ const TransferHostConfirmation = ({
value={passwordInputValue}
onChange={handleChangePasswordInput} // eslint-disable-line react/jsx-no-bind
/>
<ValidationMessage
className="transfer-password-validation"
message={<FormattedMessage id="studio.transfer.alert.wasntTheRightPassword" />}
mode="error"
/>
</div>
<div className="transfer-forgot-link">
<a
href="/accounts/password_reset/"
......
......@@ -140,9 +140,19 @@
border-radius: .5rem;
padding: 0.5rem 1rem;
font-size: 1.5rem;
}
.transfer-password-row {
display: flex;
align-items: center;
margin-bottom: 1rem;
}
.transfer-password-validation {
position: relative;
transform: translate(1rem, 0);
}
.col-sm-9 .input {
font-size: 1.5rem;
width: 50%;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment