replaced some icons

This commit is contained in:
antelle 2020-11-25 20:10:37 +01:00
parent 26990f38dd
commit 0b2c722f61
No known key found for this signature in database
GPG Key ID: 63C9777AAB7C563C
21 changed files with 65 additions and 48 deletions

View File

@ -4,11 +4,11 @@ const IconMap = [
'exclamation-triangle', 'exclamation-triangle',
'server', 'server',
'thumbtack', 'thumbtack',
'comments-o', 'comments',
'puzzle-piece', 'puzzle-piece',
'edit', 'edit',
'plug', 'plug',
'newspaper-o', 'newspaper',
'paperclip', 'paperclip',
'camera', 'camera',
'wifi', 'wifi',
@ -18,10 +18,10 @@ const IconMap = [
'certificate', 'certificate',
'bullseye', 'bullseye',
'desktop', 'desktop',
'envelope-o', 'envelope',
'cog', 'cog',
'clipboard', 'clipboard',
'paper-plane-o', 'paper-plane',
'tv', 'tv',
'bolt', 'bolt',
'inbox', 'inbox',
@ -43,7 +43,7 @@ const IconMap = [
'flask', 'flask',
'gamepad', 'gamepad',
'trash', 'trash',
'sticky-note-o', 'sticky-note',
'ban', 'ban',
'question-circle', 'question-circle',
'cube', 'cube',

View File

@ -48,7 +48,7 @@ function getIcon(ext) {
case 'log': case 'log':
case 'rtf': case 'rtf':
case 'pem': case 'pem':
return 'file-alt-o'; return 'file-alt';
case 'html': case 'html':
case 'htm': case 'htm':
case 'js': case 'js':
@ -74,9 +74,9 @@ function getIcon(ext) {
case 'yml': case 'yml':
case 'asm': case 'asm':
case 'bat': case 'bat':
return 'file-code-o'; return 'file-code';
case 'pdf': case 'pdf':
return 'file-pdf-o'; return 'file-pdf';
case 'zip': case 'zip':
case 'rar': case 'rar':
case 'bz': case 'bz':
@ -89,16 +89,16 @@ function getIcon(ext) {
case 'ace': case 'ace':
case 'dmg': case 'dmg':
case 'jar': case 'jar':
return 'file-archive-o'; return 'file-archive';
case 'doc': case 'doc':
case 'docx': case 'docx':
return 'file-word-o'; return 'file-word';
case 'xls': case 'xls':
case 'xlsx': case 'xlsx':
return 'file-excel-o'; return 'file-excel';
case 'ppt': case 'ppt':
case 'pptx': case 'pptx':
return 'file-powerpoint-o'; return 'file-powerpoint';
case 'jpeg': case 'jpeg':
case 'jpg': case 'jpg':
case 'png': case 'png':
@ -108,7 +108,7 @@ function getIcon(ext) {
case 'svg': case 'svg':
case 'ico': case 'ico':
case 'psd': case 'psd':
return 'file-image-o'; return 'file-image';
case 'avi': case 'avi':
case 'mp4': case 'mp4':
case '3gp': case '3gp':
@ -117,13 +117,13 @@ function getIcon(ext) {
case 'mpeg': case 'mpeg':
case 'mpg': case 'mpg':
case 'mpe': case 'mpe':
return 'file-video-o'; return 'file-video';
case 'mp3': case 'mp3':
case 'wav': case 'wav':
case 'flac': case 'flac':
return 'file-audio-o'; return 'file-audio';
} }
return 'file-o'; return 'file';
} }
function getMimeType(ext) { function getMimeType(ext) {

View File

@ -69,7 +69,7 @@ class MenuModel extends Model {
{ locTitle: 'menuSetGeneral', icon: 'cog', page: 'general', active: true } { locTitle: 'menuSetGeneral', icon: 'cog', page: 'general', active: true }
]); ]);
this.shortcutsSection = new MenuSectionModel([ this.shortcutsSection = new MenuSectionModel([
{ locTitle: 'shortcuts', icon: 'keyboard-o', page: 'shortcuts' } { locTitle: 'shortcuts', icon: 'keyboard', page: 'shortcuts' }
]); ]);
this.pluginsSection = new MenuSectionModel([ this.pluginsSection = new MenuSectionModel([
{ locTitle: 'plugins', icon: 'puzzle-piece', page: 'plugins' } { locTitle: 'plugins', icon: 'puzzle-piece', page: 'plugins' }

View File

@ -267,7 +267,7 @@ class DetailsView extends View {
if (AutoType.enabled) { if (AutoType.enabled) {
moreOptions.push({ moreOptions.push({
value: 'auto-type', value: 'auto-type',
icon: 'keyboard-o', icon: 'keyboard',
text: Locale.detAutoTypeSettings text: Locale.detAutoTypeSettings
}); });
} }
@ -893,7 +893,7 @@ class DetailsView extends View {
} }
} }
if (AutoType.enabled) { if (AutoType.enabled) {
options.push({ value: 'det-auto-type', icon: 'keyboard-o', text: Locale.detAutoType }); options.push({ value: 'det-auto-type', icon: 'keyboard', text: Locale.detAutoType });
} }
Events.emit('show-context-menu', Object.assign(e, { options })); Events.emit('show-context-menu', Object.assign(e, { options }));
} }

View File

@ -236,7 +236,7 @@ class FieldView extends View {
} }
if (AutoType.enabled && this.model.sequence) { if (AutoType.enabled && this.model.sequence) {
options.push({ value: 'autotype', icon: 'keyboard-o', text: Locale.detAutoTypeField }); options.push({ value: 'autotype', icon: 'keyboard', text: Locale.detAutoTypeField });
} }
const rect = this.$el[0].getBoundingClientRect(); const rect = this.$el[0].getBoundingClientRect();

View File

@ -51,9 +51,10 @@ class IconSelectView extends View {
return; return;
} }
this.downloadingFavicon = true; this.downloadingFavicon = true;
this.$el.find('.icon-select__icon-download>i').addClass('fa-spinner spin'); this.$el.find('.icon-select__icon-download>i').addClass('spin');
this.$el this.$el
.find('.icon-select__icon-download') .find('.icon-select__icon-download')
.addClass('icon-select__icon--progress')
.removeClass('icon-select__icon--download-error'); .removeClass('icon-select__icon--download-error');
const url = this.getIconUrl(true); const url = this.getIconUrl(true);
const img = document.createElement('img'); const img = document.createElement('img');
@ -62,19 +63,20 @@ class IconSelectView extends View {
img.onload = () => { img.onload = () => {
this.setSpecialImage(img, 'download'); this.setSpecialImage(img, 'download');
this.$el.find('.icon-select__icon-download img').remove(); this.$el.find('.icon-select__icon-download img').remove();
this.$el.find('.icon-select__icon-download>i').removeClass('fa-spinner spin'); this.$el.find('.icon-select__icon-download>i').removeClass('spin');
this.$el this.$el
.find('.icon-select__icon-download') .find('.icon-select__icon-download')
.removeClass('icon-select__icon--progress')
.addClass('icon-select__icon--custom-selected') .addClass('icon-select__icon--custom-selected')
.append(img); .append(img);
this.downloadingFavicon = false; this.downloadingFavicon = false;
}; };
img.onerror = (e) => { img.onerror = (e) => {
logger.error('Favicon download error: ' + url, e); logger.error('Favicon download error: ' + url, e);
this.$el.find('.icon-select__icon-download>i').removeClass('fa-spinner spin'); this.$el.find('.icon-select__icon-download>i').removeClass('spin');
this.$el this.$el
.find('.icon-select__icon-download') .find('.icon-select__icon-download')
.removeClass('icon-select__icon--custom-selected') .removeClass('icon-select__icon--custom-selected icon-select__icon--progress')
.addClass('icon-select__icon--download-error'); .addClass('icon-select__icon--download-error');
this.downloadingFavicon = false; this.downloadingFavicon = false;
}; };

View File

@ -803,7 +803,7 @@ class OpenView extends View {
Alerts.alert({ Alerts.alert({
header: Locale.openSelectFile, header: Locale.openSelectFile,
body: Locale.openSelectFileBody, body: Locale.openSelectFileBody,
icon: storage.icon || 'file-alt-o', icon: storage.icon || 'file-alt',
buttons: [{ result: '', title: Locale.alertCancel }], buttons: [{ result: '', title: Locale.alertCancel }],
esc: '', esc: '',
click: '', click: '',

View File

@ -336,7 +336,7 @@ class SettingsFileView extends View {
Alerts.alert({ Alerts.alert({
header: '', header: '',
body: '', body: '',
icon: storage.icon || 'file-alt-o', icon: storage.icon || 'file-alt',
buttons: [Alerts.buttons.ok, Alerts.buttons.cancel], buttons: [Alerts.buttons.ok, Alerts.buttons.cancel],
esc: '', esc: '',
opaque: true, opaque: true,

View File

@ -58,6 +58,11 @@
&-post { &-post {
display: none; display: none;
} }
&-post {
margin-left: $tiny-spacing;
margin-right: $small-spacing;
vertical-align: bottom;
}
cursor: pointer; cursor: pointer;
@include mobile { @include mobile {
line-height: $mobile-back-button-height; line-height: $mobile-back-button-height;

View File

@ -61,15 +61,15 @@ $fa-var-cog: next-fa-glyph();
$fa-var-server: next-fa-glyph(); $fa-var-server: next-fa-glyph();
$fa-var-file-alt: next-fa-glyph(); $fa-var-file-alt: next-fa-glyph();
$fa-var-file-alt-o: next-fa-glyph(); $fa-var-file-alt-o: next-fa-glyph();
$fa-var-file-code-o: next-fa-glyph(); $fa-var-file-code: next-fa-glyph();
$fa-var-file-pdf-o: next-fa-glyph(); $fa-var-file-pdf: next-fa-glyph();
$fa-var-file-archive-o: next-fa-glyph(); $fa-var-file-archive: next-fa-glyph();
$fa-var-file-word-o: next-fa-glyph(); $fa-var-file-word: next-fa-glyph();
$fa-var-file-excel-o: next-fa-glyph(); $fa-var-file-excel: next-fa-glyph();
$fa-var-file-powerpoint-o: next-fa-glyph(); $fa-var-file-powerpoint: next-fa-glyph();
$fa-var-file-image-o: next-fa-glyph(); $fa-var-file-image: next-fa-glyph();
$fa-var-file-video-o: next-fa-glyph(); $fa-var-file-video: next-fa-glyph();
$fa-var-file-audio-o: next-fa-glyph(); $fa-var-file-audio: next-fa-glyph();
$fa-var-onedrive: next-fa-glyph(); $fa-var-onedrive: next-fa-glyph();
$fa-var-question: next-fa-glyph(); $fa-var-question: next-fa-glyph();
$fa-var-sign-out-alt: next-fa-glyph(); $fa-var-sign-out-alt: next-fa-glyph();
@ -80,7 +80,7 @@ $fa-var-tags: next-fa-glyph();
$fa-var-th-large: next-fa-glyph(); $fa-var-th-large: next-fa-glyph();
$fa-var-trash: next-fa-glyph(); $fa-var-trash: next-fa-glyph();
$fa-var-trash-alt: next-fa-glyph(); $fa-var-trash-alt: next-fa-glyph();
$fa-var-keyboard-o: next-fa-glyph(); $fa-var-keyboard: next-fa-glyph();
$fa-var-puzzle-piece: next-fa-glyph(); $fa-var-puzzle-piece: next-fa-glyph();
$fa-var-usb: next-fa-glyph(); $fa-var-usb: next-fa-glyph();
$fa-var-info: next-fa-glyph(); $fa-var-info: next-fa-glyph();
@ -89,10 +89,10 @@ $fa-var-key: next-fa-glyph();
$fa-var-globe: next-fa-glyph(); $fa-var-globe: next-fa-glyph();
$fa-var-exclamation-triangle: next-fa-glyph(); $fa-var-exclamation-triangle: next-fa-glyph();
$fa-var-thumbtack: next-fa-glyph(); $fa-var-thumbtack: next-fa-glyph();
$fa-var-comments-o: next-fa-glyph(); $fa-var-comments: next-fa-glyph();
$fa-var-edit: next-fa-glyph(); $fa-var-edit: next-fa-glyph();
$fa-var-plug: next-fa-glyph(); $fa-var-plug: next-fa-glyph();
$fa-var-newspaper-o: next-fa-glyph(); $fa-var-newspaper: next-fa-glyph();
$fa-var-paperclip: next-fa-glyph(); $fa-var-paperclip: next-fa-glyph();
$fa-var-camera: next-fa-glyph(); $fa-var-camera: next-fa-glyph();
$fa-var-wifi: next-fa-glyph(); $fa-var-wifi: next-fa-glyph();
@ -103,9 +103,9 @@ $fa-var-barcode: next-fa-glyph();
$fa-var-certificate: next-fa-glyph(); $fa-var-certificate: next-fa-glyph();
$fa-var-bullseye: next-fa-glyph(); $fa-var-bullseye: next-fa-glyph();
$fa-var-desktop: next-fa-glyph(); $fa-var-desktop: next-fa-glyph();
$fa-var-envelope-o: next-fa-glyph(); $fa-var-envelope: next-fa-glyph();
$fa-var-clipboard: next-fa-glyph(); $fa-var-clipboard: next-fa-glyph();
$fa-var-paper-plane-o: next-fa-glyph(); $fa-var-paper-plane: next-fa-glyph();
$fa-var-tv: next-fa-glyph(); $fa-var-tv: next-fa-glyph();
$fa-var-inbox: next-fa-glyph(); $fa-var-inbox: next-fa-glyph();
$fa-var-save: next-fa-glyph(); $fa-var-save: next-fa-glyph();
@ -125,6 +125,7 @@ $fa-var-clock: next-fa-glyph();
$fa-var-search: next-fa-glyph(); $fa-var-search: next-fa-glyph();
$fa-var-flask: next-fa-glyph(); $fa-var-flask: next-fa-glyph();
$fa-var-gamepad: next-fa-glyph(); $fa-var-gamepad: next-fa-glyph();
$fa-var-sticky-note: next-fa-glyph();
$fa-var-sticky-note-o: next-fa-glyph(); $fa-var-sticky-note-o: next-fa-glyph();
$fa-var-question-circle: next-fa-glyph(); $fa-var-question-circle: next-fa-glyph();
$fa-var-cube: next-fa-glyph(); $fa-var-cube: next-fa-glyph();

View File

@ -17,6 +17,7 @@ $heading-line-height: 1.2;
$base-border-radius: 1px; $base-border-radius: 1px;
$base-spacing: $base-line-height * 1em; $base-spacing: $base-line-height * 1em;
$small-spacing: $base-spacing / 2; $small-spacing: $base-spacing / 2;
$tiny-spacing: $small-spacing / 2;
$base-z-index: 0; $base-z-index: 0;
$base-padding-v: 0.5em; $base-padding-v: 0.5em;
$base-padding-h: 1em; $base-padding-h: 1em;

View File

@ -33,6 +33,9 @@
display: none; display: none;
} }
} }
&--progress > i:before {
content: $fa-var-spinner;
}
&--download-error > i:before { &--download-error > i:before {
content: $fa-var-ban; content: $fa-var-ban;
} }

View File

@ -5,4 +5,9 @@
right: $base-padding-h; right: $base-padding-h;
padding: $base-padding-v * 2 0 1px 0; padding: $base-padding-v * 2 0 1px 0;
z-index: 1; z-index: 1;
&__post {
vertical-align: bottom;
margin-left: $tiny-spacing;
margin-right: $small-spacing;
}
} }

View File

@ -1,6 +1,6 @@
<div class="gen-ps"> <div class="gen-ps">
<div class="back-button"> <div class="back-button">
{{res 'retToApp'}} <i class="fa fa-arrow-circle-left"></i> {{res 'retToApp'}} <i class="fa fa-arrow-circle-left back-button__post"></i>
</div> </div>
<div class="scroller"> <div class="scroller">
<div class="gen-ps__content"> <div class="gen-ps__content">

View File

@ -1,6 +1,6 @@
<div class="grp"> <div class="grp">
<div class="back-button"> <div class="back-button">
{{res 'retToApp'}} <i class="fa fa-arrow-circle-left"></i> {{res 'retToApp'}} <i class="fa fa-arrow-circle-left back-button__post"></i>
</div> </div>
<div class="scroller"> <div class="scroller">
<div class="grp__content"> <div class="grp__content">

View File

@ -1,7 +1,7 @@
<div class="import-csv"> <div class="import-csv">
<div class="import-csv__top"> <div class="import-csv__top">
<div class="back-button"> <div class="back-button">
{{res 'retToApp'}} <i class="fa fa-arrow-circle-left"></i> {{res 'retToApp'}} <i class="fa fa-arrow-circle-left back-button__post"></i>
</div> </div>
<h1>{{res 'importCsvTitle'}}</h1> <h1>{{res 'importCsvTitle'}}</h1>
</div> </div>

View File

@ -62,7 +62,7 @@
<h3>Graphics</h3> <h3>Graphics</h3>
<ul> <ul>
<li><a href="https://fontawesome.com/" target="_blank">fontawesome</a><span class="muted-color">, the iconic SVG, font, and CSS toolkit, </span> <li><a href="https://fontawesome.com/" target="_blank">fontawesome</a><span class="muted-color">, the iconic SVG, font, and CSS toolkit, </span>
<a href="{{licenseLinkApache}}" class="muted-color" target="_blank">CC BY 4.0 License</a></li> <a href="{{licenseLinkApache}}" class="muted-color" target="_blank">CC BY 4.0 License</a> <span class="muted-color">(icons only)</span></li>
</ul> </ul>
<h2>{{res 'setAboutLic'}}</h2> <h2>{{res 'setAboutLic'}}</h2>

View File

@ -26,7 +26,7 @@
<h2>{{res 'setFileSaveTo'}}</h2> <h2>{{res 'setFileSaveTo'}}</h2>
{{#ifneq storage 'file'}} {{#ifneq storage 'file'}}
<div class="settings__file-save-to settings__file-save-to-file"> <div class="settings__file-save-to settings__file-save-to-file">
<i class="fa fa-file-text-o"></i>{{Res 'file'}} <i class="fa fa-file-alt"></i>{{Res 'file'}}
</div> </div>
{{/ifneq}} {{/ifneq}}
{{#each storageProviders as |prv|}} {{#each storageProviders as |prv|}}

View File

@ -1,5 +1,5 @@
<div class="settings__content"> <div class="settings__content">
<h1><i class="fa fa-keyboard-o settings__head-icon"></i> {{res 'setShTitle'}}</h1> <h1><i class="fa fa-keyboard settings__head-icon"></i> {{res 'setShTitle'}}</h1>
<div><span class="shortcut">{{cmd}}A</span> {{res 'or'}} <span class="shortcut">{{alt}}A</span> {{res 'setShShowAll'}}</div> <div><span class="shortcut">{{cmd}}A</span> {{res 'or'}} <span class="shortcut">{{alt}}A</span> {{res 'setShShowAll'}}</div>
<div><span class="shortcut">{{alt}}C</span> {{res 'setShColors'}}</div> <div><span class="shortcut">{{alt}}C</span> {{res 'setShColors'}}</div>
<div><span class="shortcut">{{alt}}D</span> {{res 'setShTrash'}}</div> <div><span class="shortcut">{{alt}}D</span> {{res 'setShTrash'}}</div>

View File

@ -15,7 +15,7 @@
{{#each files as |file|}} {{#each files as |file|}}
{{#unless file.dir}} {{#unless file.dir}}
<div class="open-list__file {{#unless file.kdbx}}open-list__file--another{{/unless}}" data-path="{{file.path}}"> <div class="open-list__file {{#unless file.kdbx}}open-list__file--another{{/unless}}" data-path="{{file.path}}">
<i class="open-list__file-icon fa fa-{{#if file.kdbx}}keeweb{{else}}file-text-o{{/if}}"></i> <i class="open-list__file-icon fa fa-{{#if file.kdbx}}keeweb{{else}}file-alt-o{{/if}}"></i>
<span class="open-list__file-text">{{file.name}}</span> <span class="open-list__file-text">{{file.name}}</span>
</div> </div>
{{/unless}} {{/unless}}

View File

@ -1,6 +1,6 @@
<div class="tag"> <div class="tag">
<div class="back-button"> <div class="back-button">
{{res 'retToApp'}} <i class="fa fa-arrow-circle-left"></i> {{res 'retToApp'}} <i class="fa fa-arrow-circle-left back-button__post"></i>
</div> </div>
<h1>{{res 'tagTitle'}}</h1> <h1>{{res 'tagTitle'}}</h1>
<div class="tag__field"> <div class="tag__field">