transition(:duration="400")
.modal(v-show='isShown', v-cloak)
transition(name='modal-background')
.modal-background(v-show='isShown')
.modal-container
transition(name='modal-content')
.modal-content(v-show='isShown')
header.is-blue
span {{ $t('modal.createusertitle') }}
p.modal-notify(v-bind:class='{ "is-active": isLoading }'): i
section
label.label {{ $t('modal.createuseremail') }}
p.control.is-fullwidth
input.input(type='text', v-bind:placeholder='$t("modal.createuseremailplaceholder")', v-model='email', ref='createUserEmailInput')
section
label.label {{ $t('modal.createuserprovider') }}
p.control.is-fullwidth
select(v-model='provider')
option(value='local') Local Database
option(value='windowslive') Microsoft Account
option(value='google') Google ID
option(value='facebook') Facebook
option(value='github') GitHub
option(value='slack') Slack
section(v-if='provider=="local"')
label.label {{ $t('modal.createuserpassword') }}
p.control.is-fullwidth
input.input(type='password', placeholder='', v-model='password')
section(v-if='provider=="local"')
label.label {{ $t('modal.createuserfullname') }}
p.control.is-fullwidth
input.input(type='text', v-bind:placeholder='$t("modal.createusernameplaceholder")', v-model='name')
footer
a.button.is-grey.is-outlined(v-on:click='cancel') {{ $t('modal.discard') }}
a.button(v-on:click='create', v-if='provider=="local"', v-bind:disabled='isLoading', v-bind:class='{ "is-disabled": isLoading, "is-blue": !loading }') {{ $t('modal.createuser') }}
a.button(v-on:click='create', v-if='provider!="local"', v-bind:disabled='isLoading', v-bind:class='{ "is-disabled": isLoading, "is-blue": !loading }') {{ $t('modal.createuserauthorize') }}