<div class="my-details" data-module="myDetails" data-user-profile-endpoint="/data/user-profile.json" data-save-user-profile-endpoint="/api/ui/myireland/SaveUserProfile" data-auth-client-id="" data-auth-connection="" data-auth-endpoint="">
<div class="my-details__inner">
<h3 class="my-details__title">My details</h3>
<p class="my-details__description">Your credentials to log in to your account across devices. Your first and last name will be visible to people you share a board with.</p>
<div class="my-details__form-container">
<div class="my-details__form-row">
<div class="my-details__form-col my-details__form-col--two-col">
<label for="first-name" class="my-details__label">First name</label>
<input type="text" id="first-name" class="my-details__input js-firstname">
</div>
<div class="my-details__form-col my-details__form-col--two-col">
<label for="last-name" class="my-details__label">Last name</label>
<input type="text" id="last-name" class="my-details__input js-lastname">
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col my-details__form-col--input-locked">
<label for="email-address" class="my-details__label">Email address</label>
<input type="email" id="email-address" class="my-details__input js-emailaddress" disabled>
</div>
<div class="my-details__form-col my-details__form-col--tooltip-col">
To change your email address please <a href='#'>get in touch</a>
</div>
</div>
<div class="my-details__form-row my-details__form-row--password">
<div class="my-details__form-col my-details__form-col--input-locked">
<label for="user-password" class="my-details__label">Password</label>
<input type="password" id="user-password" value="123456" class="my-details__input" disabled>
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col">
<a href="#" class="button-p2 js-reset-password " role="button" target="_self">Reset password</a>
<span class="my-details__reset-success-text js-reset-success-text"></span>
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col">
<a href="#" class="button-p1 js-save " role="button" target="_self">Save</a>
</div>
</div>
</div>
</div>
<div class="generic-modal js-modal js-modal-id-success">
<div class="generic-modal__inner">
<div class="grid-container">
<div class="grid-x grid-padding-x align-center">
<div class="">
<div class="generic-modal__container">
<a href="#" class="generic-modal__close-button js-close-modal js-close-cross-modal"></a>
<p class="generic-modal__subtitle">Details saved! Thank you!</h2>
<ul class="generic-modal__buttons">
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="generic-modal js-modal js-modal-id-error">
<div class="generic-modal__inner">
<div class="grid-container">
<div class="grid-x grid-padding-x align-center">
<div class="">
<div class="generic-modal__container">
<a href="#" class="generic-modal__close-button js-close-modal js-close-cross-modal"></a>
<p class="generic-modal__subtitle">Sorry we've encountered an issue. Please try later.</h2>
<ul class="generic-modal__buttons">
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="my-details" data-module="myDetails" data-user-profile-endpoint="{{userProfileEndpoint}}" data-save-user-profile-endpoint="{{saveUserProfileEndpoint}}" data-auth-client-id="{{auth.clientId}}" data-auth-connection="{{auth.connection}}" data-auth-endpoint="{{auth.endpoint}}">
<div class="my-details__inner">
<h3 class="my-details__title">{{title}}</h3>
<p class="my-details__description">{{description}}</p>
<div class="my-details__form-container">
<div class="my-details__form-row">
<div class="my-details__form-col my-details__form-col--two-col">
<label for="first-name" class="my-details__label">{{firstnameLabel}}</label>
<input type="text" id="first-name" class="my-details__input js-firstname">
</div>
<div class="my-details__form-col my-details__form-col--two-col">
<label for="last-name" class="my-details__label">{{lastnameLabel}}</label>
<input type="text" id="last-name" class="my-details__input js-lastname">
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col my-details__form-col--input-locked">
<label for="email-address" class="my-details__label">{{emailAddressLabel}}</label>
<input type="email" id="email-address" class="my-details__input js-emailaddress" disabled>
</div>
<div class="my-details__form-col my-details__form-col--tooltip-col">
{{{emailAddressTooltip}}}
</div>
</div>
<div class="my-details__form-row my-details__form-row--password">
<div class="my-details__form-col my-details__form-col--input-locked">
<label for="user-password" class="my-details__label">{{passwordLabel}}</label>
<input type="password" id="user-password" value="{{passwordFieldDefaultValue}}" class="my-details__input" disabled>
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col">
{{> @cp-button-secondary target=resetPasswordButton.target url=resetPasswordButton.url text=resetPasswordButton.text cssClasses="js-reset-password" }}
<span class="my-details__reset-success-text js-reset-success-text">{{resetSuccessText}}</span>
</div>
</div>
<div class="my-details__form-row">
<div class="my-details__form-col">
{{> @cp-button-primary target=saveButton.target url=saveButton.url text=saveButton.text cssClasses="js-save" }}
</div>
</div>
</div>
</div>
{{#if successModal}}
{{> @cp-generic-modal successModal }}
{{/if}}
{{#if errorModal}}
{{> @cp-generic-modal errorModal }}
{{/if}}
</div>
{
"userProfileEndpoint": "/data/user-profile.json",
"saveUserProfileEndpoint": "/api/ui/myireland/SaveUserProfile",
"title": "My details",
"description": "Your credentials to log in to your account across devices. Your first and last name will be visible to people you share a board with.",
"firstnameLabel": "First name",
"lastnameLabel": "Last name",
"emailAddressLabel": "Email address",
"emailAddressTooltip": "To change your email address please <a href='#'>get in touch</a>",
"passwordLabel": "Password",
"passwordFieldDefaultValue": "123456",
"resetPasswordButton": {
"target": "_self",
"text": "Reset password",
"url": "#"
},
"saveButton": {
"target": "_self",
"text": "Save",
"url": "#"
},
"successModal": {
"id": "success",
"subtitle": "Details saved! Thank you!"
},
"errorModal": {
"id": "error",
"subtitle": "Sorry we've encountered an issue. Please try later."
}
}
There are no notes for this item.