add white box behind create user confirm

This commit is contained in:
Mads Rasmussen
2018-08-29 10:12:33 +02:00
parent 40e1d2445c
commit ca98409379

View File

@@ -420,74 +420,78 @@
<a class="umb-package-details__back-link" href="" ng-click="vm.setUsersViewState('overview');">&larr; <localize key="user_backToUsers">Back to users</localize></a>
</umb-editor-sub-header-content-left>
</umb-editor-sub-header>
<div class="flex justify-center">
<div style="max-width: 500px;">
<!-- Success text -->
<div class="flex items-center" style="margin-bottom: 15px;">
<umb-checkmark
checked="vm.usersViewState === 'createUserSuccess'"
size="m">
</umb-checkmark>
<h3 class="bold" style="margin: 0 0 0 10px;">
{{vm.newUser.name | umbWordLimit:1}}
<localize key="user_userCreated">has been created</localize>
</h3>
</div>
<p style="line-height: 1.6em; margin-bottom: 20px;"><localize key="user_userCreatedSuccessHelp"></localize></p>
<umb-box style="max-width: 500px;">
<umb-box-content>
<!-- New password -->
<div>
<label class="bold"><localize key="user_password">Password</localize></label>
<div class="flex items-center justify-between" style="background-color: #ffffff; padding: 10px 20px; border-radius: 3px; margin-bottom: 30px;">
<div ng-show="vm.newUser.showPassword">{{vm.newUser.resetPasswordValue}}</div>
<div ng-show="!vm.newUser.showPassword">&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;</div>
<div>
<umb-button ng-if="!vm.newUser.showPassword"
type="button"
action="vm.toggleNewUserPassword()"
label-key="general_show"
size="xs">
</umb-button>
<umb-button ng-if="vm.newUser.showPassword"
type="button"
action="vm.toggleNewUserPassword()"
label-key="general_hide"
size="xs">
</umb-button>
<umb-button ng-if="vm.newUser.resetPasswordValue"
umb-clipboard
umb-clipboard-success="vm.copySuccess(e)"
umb-clipboard-error="vm.copyError(e)"
umb-clipboard-text="{{vm.newUser.resetPasswordValue}}"
state="vm.page.copyPasswordButtonState"
type="button"
label-key="general_copy" size="xs">
</umb-button>
<!-- Success text -->
<div class="flex items-center" style="margin-bottom: 15px;">
<umb-checkmark
checked="vm.usersViewState === 'createUserSuccess'"
size="m">
</umb-checkmark>
<h3 class="bold" style="margin: 0 0 0 10px;">
{{vm.newUser.name | umbWordLimit:1}}
<localize key="user_userCreated">has been created</localize>
</h3>
</div>
<p style="line-height: 1.6em; margin-bottom: 20px;"><localize key="user_userCreatedSuccessHelp"></localize></p>
<!-- New password -->
<div>
<label class="bold"><localize key="user_password">Password</localize></label>
<div class="flex items-center justify-between" style="background-color: #f3f3f5; padding: 10px 20px; border-radius: 3px; margin-bottom: 30px;">
<div ng-show="vm.newUser.showPassword">{{vm.newUser.resetPasswordValue}}</div>
<div ng-show="!vm.newUser.showPassword">&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;</div>
<div>
<umb-button ng-if="!vm.newUser.showPassword"
type="button"
action="vm.toggleNewUserPassword()"
label-key="general_show"
size="xs">
</umb-button>
<umb-button ng-if="vm.newUser.showPassword"
type="button"
action="vm.toggleNewUserPassword()"
label-key="general_hide"
size="xs">
</umb-button>
<umb-button ng-if="vm.newUser.resetPasswordValue"
umb-clipboard
umb-clipboard-success="vm.copySuccess(e)"
umb-clipboard-error="vm.copyError(e)"
umb-clipboard-text="{{vm.newUser.resetPasswordValue}}"
state="vm.page.copyPasswordButtonState"
type="button"
label-key="general_copy" size="xs">
</umb-button>
</div>
</div>
</div>
</div>
<!-- actions -->
<div>
<umb-button
type="button" button-style="info"
label-key="user_createAnotherUser"
action="vm.setUsersViewState('createUser');"
size="m">
</umb-button>
<umb-button
type="button"
button-style="success"
label-key="user_goToProfile"
action="vm.goToUser(vm.newUser.id);"
size="m">
</umb-button>
</div>
<!-- actions -->
<div>
<umb-button
type="button" button-style="info"
label-key="user_createAnotherUser"
action="vm.setUsersViewState('createUser');"
size="m">
</umb-button>
<umb-button
type="button"
button-style="success"
label-key="user_goToProfile"
action="vm.goToUser(vm.newUser.id);"
size="m">
</umb-button>
</div>
</umb-box-content>
</umb-box>
</div>
</div>
</div>