Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

settings: Add modal fade. 

This implements the modal fade idea suggested here:

https://chat.zulip.org/#narrow/stream/6-frontend/subject/Visual.20Design.20Strategy.20for.20Settings.20UI/near/559763
This commit is contained in:
guaca 2018-04-18 22:40:26 -04:00 committed by Tim Abbott
parent 160931377f
commit 3c01ea78b0
3 changed files with 16 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
static/styles/settings.css
View File

@ -1222,6 +1222,14 @@ input[type=checkbox].inline-block {
transition: opacity 100ms ease-out; transition: opacity 100ms ease-out;
} }
.modal.fade {
-webkit-transition: opacity 0.3s linear;
-moz-transition: opacity 0.3s linear;
-o-transition: opacity 0.3s linear;
transition: opacity 0.3s linear;
transform: translateY(-50%);
}
#settings_page .table-striped thead th.active:after { #settings_page .table-striped thead th.active:after {
content: " \f0d8"; content: " \f0d8";
white-space: pre; white-space: pre;
@ -1371,7 +1379,6 @@ input[type=checkbox].inline-block {
.modal.fade.in { .modal.fade.in {
top: 50%; top: 50%;
transform: translateY(-50%);
} }
#id_realm_create_stream_permission, #id_realm_create_stream_permission,
@ -1385,6 +1392,10 @@ input[type=checkbox].inline-block {
margin-top: 10px; margin-top: 10px;
} }
#change_email_modal,
#change_full_name_modal,
#change_password_modal,
#default_language_modal,
#deactivate_self_modal, #deactivate_self_modal,
#deactivate-realm-modal { #deactivate-realm-modal {
box-shadow: 0px 0px 75px hsla(0, 0%, 0%, 0.5); box-shadow: 0px 0px 75px hsla(0, 0%, 0%, 0.5);

2
static/templates/default_language_modal.handlebars
View File

@ -1,4 +1,4 @@
<div id="default_language_modal" class="modal hide modal-bg" tabindex="-1" role="dialog" <div id="default_language_modal" class="modal hide modal-bg fade" tabindex="-1" role="dialog"
aria-labelledby="default_language_modal_label" aria-hidden="true"> aria-labelledby="default_language_modal_label" aria-hidden="true">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button>

6
static/templates/settings/account-settings.handlebars
View File

@ -17,7 +17,7 @@
title="{{t 'Changing email addresses has been disabled by your Zulip organization administrators. Contact an administrator for help.' }}"></i> title="{{t 'Changing email addresses has been disabled by your Zulip organization administrators. Contact an administrator for help.' }}"></i>
</div> </div>
<div id="change_email_modal" class="modal modal-bg hide" tabindex="-1" role="dialog" <div id="change_email_modal" class="modal modal-bg hide fade" tabindex="-1" role="dialog"
aria-labelledby="change_email_modal_label" aria-hidden="true"> aria-labelledby="change_email_modal_label" aria-hidden="true">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button>
@ -51,7 +51,7 @@
{{#if page_params.is_admin}}style="display:none"{{else}}{{#unless page_params.realm_name_changes_disabled}}style="display:none"{{/unless}}{{/if}} {{#if page_params.is_admin}}style="display:none"{{else}}{{#unless page_params.realm_name_changes_disabled}}style="display:none"{{/unless}}{{/if}}
title="{{t 'Changing your name has been disabled by your Zulip organization administrators. Contact an administrator for help.' }}"/> title="{{t 'Changing your name has been disabled by your Zulip organization administrators. Contact an administrator for help.' }}"/>
</div> </div>
<div id="change_full_name_modal" class="modal modal-bg hide" tabindex="-1" role="dialog" <div id="change_full_name_modal" class="modal modal-bg hide fade" tabindex="-1" role="dialog"
aria-labelledby="change_full_name_modal_label" aria-hidden="true"> aria-labelledby="change_full_name_modal_label" aria-hidden="true">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button>
@ -85,7 +85,7 @@
</div> </div>
{{/if}} {{/if}}
<div id="change_password_modal" class="modal modal-bg hide" tabindex="-1" role="dialog" <div id="change_password_modal" class="modal modal-bg hide fade" tabindex="-1" role="dialog"
aria-labelledby="change_password_modal_label" aria-hidden="true"> aria-labelledby="change_password_modal_label" aria-hidden="true">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button> <button type="button" class="close" data-dismiss="modal" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button>