Broken styles in Administration's contextual bar (#14222)
* Wrap userEdit into contextual bar content * Remove contextual bar header style when empty * Fix padding in admin room info and admin user infopull/14225/head^2
Tasso Evangelista
6 years ago
committed by
Guilherme Gazzo
parent
abe05b6102
commit
b4df795671
@ -1,12 +1,9 @@ |
||||
<template name="adminUserInfo"> |
||||
|
||||
|
||||
{{#if _id}} |
||||
{{> userInfo .}} |
||||
{{else}} |
||||
<div class="edit-form"> |
||||
<div>{{_ "Please_select_an_user"}}</div> |
||||
</div> |
||||
{{/if}} |
||||
|
||||
{{#if _id}} |
||||
{{> userInfo .}} |
||||
{{else}} |
||||
<section class="contextual-bar__content"> |
||||
<div>{{_ "Please_select_an_user"}}</div> |
||||
</section> |
||||
{{/if}} |
||||
</template> |
||||
|
||||
@ -1,170 +1,172 @@ |
||||
<template name="userEdit"> |
||||
{{#unless canEditOrAdd}} |
||||
<p class="secondary-font-color">{{_ "You_are_not_authorized_to_view_this_page"}}</p> |
||||
{{else}} |
||||
<form class="" action="index.html" method="post" autocomplete="off"> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<label class="rc-form-label"> |
||||
{{_ "Profile_picture"}} |
||||
</label> |
||||
<div class="rc-select-avatar"> |
||||
<div class="rc-select-avatar__preview"> |
||||
{{#if avatarPreview}} |
||||
{{#if $eq avatarPreview.service 'initials'}} |
||||
{{> avatar username=avatarPreview.blob}} |
||||
<section class="contextual-bar__content"> |
||||
{{#unless canEditOrAdd}} |
||||
<p class="secondary-font-color">{{_ "You_are_not_authorized_to_view_this_page"}}</p> |
||||
{{else}} |
||||
<form action="index.html" method="post" autocomplete="off"> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<label class="rc-form-label"> |
||||
{{_ "Profile_picture"}} |
||||
</label> |
||||
<div class="rc-select-avatar"> |
||||
<div class="rc-select-avatar__preview"> |
||||
{{#if avatarPreview}} |
||||
{{#if $eq avatarPreview.service 'initials'}} |
||||
{{> avatar username=avatarPreview.blob}} |
||||
{{else}} |
||||
{{> avatar url=avatarPreview.blob}} |
||||
{{/if}} |
||||
{{else}} |
||||
{{> avatar url=avatarPreview.blob}} |
||||
{{> avatar username=user.username}} |
||||
{{/if}} |
||||
{{else}} |
||||
{{> avatar username=user.username}} |
||||
{{/if}} |
||||
</div> |
||||
|
||||
<div class="rc-select-avatar__list"> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-initials" aria-label="{{_ "initials_avatar" }}"> |
||||
{{> avatar username=initialsUsername }} |
||||
</div> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-upload" aria-label="{{_ "Upload_user_avatar" }}"> |
||||
<label class="rc-select-avatar__upload-label avatar" for="upload-avatar"> |
||||
{{> icon block="rc-select-avatar__upload-icon" icon="upload"}} |
||||
</label> |
||||
<input type="file" name="" value="" id="upload-avatar" style="display:none;" accept="image/x-png,image/gif,image/jpeg"> |
||||
</div> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-url {{selectUrl}}" aria-label="{{_ "Use_url_for_avatar" }}"> |
||||
<label class="rc-select-avatar__upload-label avatar"> |
||||
{{> icon block="rc-select-avatar__upload-icon" icon="permalink"}} |
||||
</label> |
||||
</div> |
||||
|
||||
<div class="rc-input"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-select-avatar__list"> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-initials" aria-label="{{_ "initials_avatar" }}"> |
||||
{{> avatar username=initialsUsername }} |
||||
</div> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-upload" aria-label="{{_ "Upload_user_avatar" }}"> |
||||
<label class="rc-select-avatar__upload-label avatar" for="upload-avatar"> |
||||
{{> icon block="rc-select-avatar__upload-icon" icon="upload"}} |
||||
</label> |
||||
<input type="file" name="" value="" id="upload-avatar" style="display:none;" accept="image/x-png,image/gif,image/jpeg"> |
||||
</div> |
||||
<div class="rc-select-avatar__list-item rc-tooltip js-select-avatar-url {{selectUrl}}" aria-label="{{_ "Use_url_for_avatar" }}"> |
||||
<label class="rc-select-avatar__upload-label avatar"> |
||||
{{> icon block="rc-select-avatar__upload-icon" icon="permalink"}} |
||||
</label> |
||||
</div> |
||||
|
||||
<div class="rc-input"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title"> |
||||
{{_ "Use_url_for_avatar"}} |
||||
</div> |
||||
<div class="rc-input__wrapper"> |
||||
<input name="avatar_url" class="rc-input__element js-avatar-url-input" placeholder="{{_ "Use_url_for_avatar"}}"> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="rc-input rc-form-group rc-form-group--small"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title"> |
||||
{{_ "Use_url_for_avatar"}} |
||||
{{_ "Name"}} |
||||
</div> |
||||
<div class="rc-input__wrapper"> |
||||
<input name="avatar_url" class="rc-input__element js-avatar-url-input" placeholder="{{_ "Use_url_for_avatar"}}"> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="name" autocomplete="off" value="{{user.name}}"/> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
<div class="rc-input rc-form-group rc-form-group--small"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title"> |
||||
{{_ "Name"}} |
||||
</div> |
||||
<div class="rc-input rc-form-group rc-form-group--small"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title"> |
||||
{{_ "Username"}} |
||||
</div> |
||||
<div class="rc-input__wrapper"> |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='at' }} |
||||
</div> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="username" autocomplete="off" value="{{user.username}}"/> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<div class="rc-input"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title">{{_ "Email"}}</div> |
||||
<div class="rc-input__wrapper"> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="name" autocomplete="off" value="{{user.name}}"/> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
<div class="rc-input rc-form-group rc-form-group--small"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title"> |
||||
{{_ "Username"}} |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='mail' }} |
||||
</div> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="email" autocomplete="off" value="{{user.emails.[0].address}}"/> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
<div class="rc-switch"> |
||||
<label class="rc-switch__label" tabindex="-1"> |
||||
<input type="checkbox" class="rc-switch__input" name="type" id="verified" value="1" checked="{{user.emails.[0].verified}}"/> |
||||
<span class="rc-switch__button"> |
||||
<span class="rc-switch__button-inside"></span> |
||||
</span> |
||||
<span class="rc-switch__text"> |
||||
{{_ "Verified"}} |
||||
</span> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
|
||||
|
||||
{{#if hasPermission 'edit-other-user-password'}} |
||||
<div class="rc-form-group rc-form-group--small rc-form-group--inline"> |
||||
<div class="rc-input rc-form-item-inline"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title">{{_ "Password"}}</div> |
||||
<div class="rc-input__wrapper"> |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='at' }} |
||||
</div> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="username" autocomplete="off" value="{{user.username}}"/> |
||||
</div> |
||||
</label> |
||||
</div> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<div class="rc-input"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title">{{_ "Email"}}</div> |
||||
<div class="rc-input__wrapper"> |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='mail' }} |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='key' }} |
||||
</div> |
||||
<input name="password" class="rc-input__element rc-input__element--small" type="password" id="password" autocomplete="off" value=""/> |
||||
</div> |
||||
<input name="name" type="text" class="rc-input__element rc-input__element--small" id="email" autocomplete="off" value="{{user.emails.[0].address}}"/> |
||||
</div> |
||||
</label> |
||||
</label> |
||||
</div> |
||||
<button id="randomPassword" class="rc-button rc-button--primary rc-form-item-inline">{{_ 'Random'}}</button> |
||||
</div> |
||||
<div class="rc-switch"> |
||||
<div class="rc-form-group rc-form-group--small rc-switch"> |
||||
<label class="rc-switch__label" tabindex="-1"> |
||||
<input type="checkbox" class="rc-switch__input" name="type" id="verified" value="1" checked="{{user.emails.[0].verified}}"/> |
||||
<input class="rc-switch__input" type="checkbox" id="changePassword" value="1" checked="{{requirePasswordChange}}"/> |
||||
<span class="rc-switch__button"> |
||||
<span class="rc-switch__button-inside"></span> |
||||
</span> |
||||
<span class="rc-switch__text"> |
||||
{{_ "Verified"}} |
||||
{{_ "Require_password_change"}} |
||||
</span> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
{{/if}} |
||||
|
||||
<label for="roles">{{_ "Roles"}}</label> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<ul id="roles" class="chip-container current-user-roles"> |
||||
{{#each userRoles}} |
||||
<li class="remove-role" title="{{this}}"><i class="icon icon-cancel-circled"></i>{{this}}</li> |
||||
{{/each}} |
||||
</ul> |
||||
</div> |
||||
|
||||
{{#if hasPermission 'edit-other-user-password'}} |
||||
<div class="rc-form-group rc-form-group--small rc-form-group--inline"> |
||||
<div class="rc-input rc-form-item-inline"> |
||||
<label class="rc-input__label"> |
||||
<div class="rc-input__title">{{_ "Password"}}</div> |
||||
<div class="rc-input__wrapper"> |
||||
<div class="rc-input__icon"> |
||||
{{> icon icon='key' }} |
||||
</div> |
||||
<input name="password" class="rc-input__element rc-input__element--small" type="password" id="password" autocomplete="off" value=""/> |
||||
</div> |
||||
<label for="roleSelect">{{_ "Add_Role"}}</label> |
||||
<div class="rc-form-group rc-form-group--small rc-form-group--inline"> |
||||
{{#let roles=role}} |
||||
<select id="roleSelect" class="rc-input rc-form-item-inline rc-input--small" {{disabled role}}> |
||||
<option value="placeholder" disabled selected>{{_ "Select_role"}}</option> |
||||
{{#each roles}} |
||||
<option value="{{_id}}">{{name}}</option> |
||||
{{/each}} |
||||
</select> |
||||
{{/let}} |
||||
<button id="addRole" class="rc-button rc-button--primary rc-form-item-inline" {{disabled role}}>{{_ 'Add_Role'}}</button> |
||||
</div> |
||||
{{#unless user}} |
||||
<div class="input-line"> |
||||
<label for="joinDefaultChannels"> |
||||
<input type="checkbox" id="joinDefaultChannels" value="1" checked="true"> |
||||
{{_ "Join_default_channels"}} |
||||
</label> |
||||
</div> |
||||
<button id="randomPassword" class="rc-button rc-button--primary rc-form-item-inline">{{_ 'Random'}}</button> |
||||
</div> |
||||
<div class="rc-form-group rc-form-group--small rc-switch"> |
||||
<label class="rc-switch__label" tabindex="-1"> |
||||
<input class="rc-switch__input" type="checkbox" id="changePassword" value="1" checked="{{requirePasswordChange}}"/> |
||||
<span class="rc-switch__button"> |
||||
<span class="rc-switch__button-inside"></span> |
||||
</span> |
||||
<span class="rc-switch__text"> |
||||
{{_ "Require_password_change"}} |
||||
</span> |
||||
</label> |
||||
</div> |
||||
{{/if}} |
||||
|
||||
<label for="roles">{{_ "Roles"}}</label> |
||||
<div class="rc-form-group rc-form-group--small"> |
||||
<ul id="roles" class="chip-container current-user-roles"> |
||||
{{#each userRoles}} |
||||
<li class="remove-role" title="{{this}}"><i class="icon icon-cancel-circled"></i>{{this}}</li> |
||||
{{/each}} |
||||
</ul> |
||||
</div> |
||||
|
||||
<label for="roleSelect">{{_ "Add_Role"}}</label> |
||||
<div class="rc-form-group rc-form-group--small rc-form-group--inline"> |
||||
{{#let roles=role}} |
||||
<select id="roleSelect" class="rc-input rc-form-item-inline rc-input--small" {{disabled role}}> |
||||
<option value="placeholder" disabled selected>{{_ "Select_role"}}</option> |
||||
{{#each roles}} |
||||
<option value="{{_id}}">{{name}}</option> |
||||
{{/each}} |
||||
</select> |
||||
{{/let}} |
||||
<button id="addRole" class="rc-button rc-button--primary rc-form-item-inline" {{disabled role}}>{{_ 'Add_Role'}}</button> |
||||
</div> |
||||
{{#unless user}} |
||||
<div class="input-line"> |
||||
<label for="joinDefaultChannels"> |
||||
<input type="checkbox" id="joinDefaultChannels" value="1" checked="true"> |
||||
{{_ "Join_default_channels"}} |
||||
</label> |
||||
</div> |
||||
<div class="input-line"> |
||||
<label for="sendWelcomeEmail"> |
||||
<input type="checkbox" id="sendWelcomeEmail" value="1" checked="true"> |
||||
{{_ "Send_welcome_email"}} |
||||
</label> |
||||
</div> |
||||
<div class="input-line"> |
||||
<label for="sendWelcomeEmail"> |
||||
<input type="checkbox" id="sendWelcomeEmail" value="1" checked="true"> |
||||
{{_ "Send_welcome_email"}} |
||||
</label> |
||||
</div> |
||||
{{/unless}} |
||||
<div class="rc-user-info__flex rc-user-info__row"> |
||||
<button class='rc-button rc-button--cancel cancel' type="button"><span>{{_ "Cancel"}}</span></button> |
||||
<button class='rc-button rc-button--primary save'><span>{{_ "Save"}}</span></button> |
||||
</div> |
||||
</form> |
||||
{{/unless}} |
||||
<div class="rc-user-info__flex rc-user-info__row"> |
||||
<button class='rc-button rc-button--cancel cancel' type="button"><span>{{_ "Cancel"}}</span></button> |
||||
<button class='rc-button rc-button--primary save'><span>{{_ "Save"}}</span></button> |
||||
</div> |
||||
</form> |
||||
{{/unless}} |
||||
</section> |
||||
</template> |
||||
|
||||
Loading…
Reference in new issue