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

settings: Changed checkbox and close icons on settings. 

Introduced a new checkmark icon in the settings page
from entypo ( www.entypo.com )  to make icons more
consistent between user and organization settings.
This commit is contained in:
Armaan Ahluwalia 2018-04-03 16:39:52 +05:30 committed by Tim Abbott
parent 58d07fabef
commit 7b8da9b6c0
5 changed files with 19 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
static/images/icon-checkbox-green.svg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 532 B

BIN
static/images/icon-checkbox-white.svg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 532 B

4
static/js/settings_ui.js
View File

@ -4,9 +4,9 @@ var exports = {};
exports.display_checkmark = function ($elem) { exports.display_checkmark = function ($elem) {
var check_mark = document.createElement("img"); var check_mark = document.createElement("img");
check_mark.src = "/static/images/checkbox-green.svg"; check_mark.src = "/static/images/icon-checkbox-green.svg";
$elem.prepend(check_mark); $elem.prepend(check_mark);
$(check_mark).css("width", "13px"); $(check_mark).css("width", "10px");
}; };
exports.strings = {}; exports.strings = {};

24
static/styles/settings.css
View File

@ -361,9 +361,9 @@ input[type=checkbox] + .inline-block {
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
font-size: 14px; font-size: 14px;
padding: 3px 12px 4px 10px; padding: 3px 14px 4px 11px;
text-decoration: none; text-decoration: none;
color: hsl(0, 0%, 43%); color: hsl(0, 0%, 46%);
font-weight: 400; font-weight: 400;
} }
@ -389,17 +389,21 @@ input[type=checkbox] + .inline-block {
} }
#settings_page .icon-button .icon-button-icon { #settings_page .icon-button .icon-button-icon {
color: #969696; vertical-align: bottom;
margin-right: 3px;
font-size: 24px;
line-height: 19px;
font-weight: 600;
} }
#settings_page .icon-button.primary .icon-button-icon { #settings_page .icon-button.primary .icon-button-icon {
color: white; width: 10px;
margin-bottom: 2px;
margin-right: 3px;
} }
#settings_page .icon-button .icon-button-text, #settings_page .icon-button .icon-button-text {
#settings_page .icon-button .icon-button-icon {
vertical-align: baseline; vertical-align: baseline;
margin-right: 2px;
} }
#settings_page .save-button-controls { #settings_page .save-button-controls {
@ -426,6 +430,7 @@ input[type=checkbox] + .inline-block {
#settings_page .save-button.saving .icon-button-loading { #settings_page .save-button.saving .icon-button-loading {
display: inline-block; display: inline-block;
margin-right: 2px;
} }
#settings_page .save-button .icon-button-loading { #settings_page .save-button .icon-button-loading {
@ -570,6 +575,7 @@ input[type=checkbox].inline-block {
width: 13px; width: 13px;
height: 20px; height: 20px;
margin: 0; margin: 0;
margin-right: 3px;
} }
#settings_page .alert-notification .loading_indicator_text { #settings_page .alert-notification .loading_indicator_text {
@ -579,9 +585,9 @@ input[type=checkbox].inline-block {
} }
#settings_page .alert-notification img { #settings_page .alert-notification img {
margin-right: 5px; margin-right: 6px;
vertical-align: middle; vertical-align: middle;
margin-top: -1px; margin-top: -2px;
} }
#notification-settings .notification-reminder { #notification-settings .notification-reminder {

4
static/templates/settings/settings-save-discard-widget.handlebars
View File

@ -3,7 +3,7 @@
<div class="input-group organization-submission subsection-changes-save"> <div class="input-group organization-submission subsection-changes-save">
<div class="icon-button button primary save-button" type="button" id="org-submit-{{section_name}}" data-status="save"> <div class="icon-button button primary save-button" type="button" id="org-submit-{{section_name}}" data-status="save">
<span class="fa fa-spinner fa-spin icon-button-loading"></span> <span class="fa fa-spinner fa-spin icon-button-loading"></span>
<span class="fa fa-check icon-button-icon"></span> <img class="icon-button-icon" src="static/images/icon-checkbox-white.svg" />
<span class="icon-button-text"> <span class="icon-button-text">
{{t 'Save changes' }} {{t 'Save changes' }}
</span> </span>
@ -11,7 +11,7 @@
</div> </div>
<div class="input-group subsection-changes-discard"> <div class="input-group subsection-changes-discard">
<div class="icon-button button discard-button" type="button" id="org-discard-{{section_name}}"> <div class="icon-button button discard-button" type="button" id="org-discard-{{section_name}}">
<span class="fa fa-times icon-button-icon"></span> <span class="icon-button-icon">×</span>
<span class="icon-button-text"> <span class="icon-button-text">
{{t 'Discard' }} {{t 'Discard' }}
</span> </span>