diff --git a/app/scripts/util/locale.js b/app/scripts/util/locale.js index 2f4e30db..abf2963f 100644 --- a/app/scripts/util/locale.js +++ b/app/scripts/util/locale.js @@ -297,6 +297,10 @@ var Locale = { setGenDownloadAndRestart: 'Download update and restart', setGenAppearance: 'Appearance', setGenTheme: 'Theme', + setGenThemeFb: 'Flat blue', + setGenThemeDb: 'Dark brown', + setGenThemeWh: 'White', + setGenThemeHc: 'High contrast', setGenShowSubgroups: 'Show entries from all subgroups', setGenTableView: 'Entries list table view', setGenColorfulIcons: 'Colorful custom icons in list', diff --git a/app/scripts/views/fields/field-view-autocomplete.js b/app/scripts/views/fields/field-view-autocomplete.js index 63ae161c..3fc85d47 100644 --- a/app/scripts/views/fields/field-view-autocomplete.js +++ b/app/scripts/views/fields/field-view-autocomplete.js @@ -21,7 +21,9 @@ var FieldViewAutocomplete = FieldViewText.extend({ width: fieldRect.width - 2 }); this.autocomplete.mousedown(this.autocompleteClick.bind(this)); - if (!this.input.val()) { + if (this.input.val()) { + this.autocomplete.hide(); + } else { this.updateAutocomplete(); } }, diff --git a/app/scripts/views/settings/settings-general-view.js b/app/scripts/views/settings/settings-general-view.js index d82aef3d..e88ecb70 100644 --- a/app/scripts/views/settings/settings-general-view.js +++ b/app/scripts/views/settings/settings-general-view.js @@ -42,9 +42,10 @@ var SettingsGeneralView = Backbone.View.extend({ views: {}, allThemes: { - fb: 'Flat blue', - db: 'Dark brown', - wh: 'White' + fb: Locale.setGenThemeFb, + db: Locale.setGenThemeDb, + wh: Locale.setGenThemeWh, + hc: Locale.setGenThemeHc }, initialize: function() { diff --git a/app/styles/base/_colors.scss b/app/styles/base/_colors.scss index de9bd23c..bd2097af 100644 --- a/app/styles/base/_colors.scss +++ b/app/styles/base/_colors.scss @@ -16,24 +16,22 @@ $violet: #d946db; @function error-color() { @return th(error-color); } // Text -@function muted-color() { @return mix(medium-color(), background-color(), 30%); } -@function muted-color-border() { @return mix(medium-color(), background-color(), 15%); } +@function muted-color() { @return mix(medium-color(), background-color(), th(mute-percent)); } +@function muted-color-border() { @return mix(medium-color(), background-color(), th(mute-percent) / 2); } @function text-selection-bg-color() { @return rgba(action-color(), .3); } @function text-selection-bg-color-error() { @return rgba(error-color(), .8); } @function text-contrast-color($bg) { @if (lightness($bg) >= lightness(background-color())) { @return text-color(); } @else { @return background-color(); } } // Borders, shadows - @function base-border-color() { @return mix(medium-color(), background-color(), 50%); } @function accent-border-color() { @return mix(medium-color(), background-color(), 65%); } -@function light-border-color() { @return mix(medium-color(), background-color(), 10%); } +@function light-border-color() { @return mix(medium-color(), background-color(), th(light-border-percent)); } @function form-box-shadow-color() { @return rgba($black, 0.06); } @function form-box-shadow-color-focus() { @return adjust-color(action-color(), $lightness: -5%, $alpha: -0.3); } @function form-box-shadow-color-focus-error() { @return adjust-color(error-color(), $lightness: -5%, $alpha: -0.3); } @function dropdown-box-shadow-color() { @return rgba(medium-color(), .05); } // Backgrounds - @function secondary-background-color() { @return mix(medium-color(), background-color(), 10%); } @function intermediate-background-color() { @return mix(medium-color(), background-color(), 3%); } @function intermediate-pressed-background-color() { @return mix(medium-color(), background-color(), 2.6%); } diff --git a/app/styles/common/_modal.scss b/app/styles/common/_modal.scss index 906cf535..ea8d5b4d 100644 --- a/app/styles/common/_modal.scss +++ b/app/styles/common/_modal.scss @@ -1,7 +1,7 @@ .modal { @include position(absolute, 0 null null 0); @include size(100%); - @include th { background-color: rgba(background-color(), .9); } + @include th { background-color: rgba(background-color(), th(modal-opacity)); } z-index: $z-index-modal; transition: background-color $base-duration $base-timing; diff --git a/app/styles/themes/_all-themes.scss b/app/styles/themes/_all-themes.scss index 24d1b4a7..7daf5c72 100644 --- a/app/styles/themes/_all-themes.scss +++ b/app/styles/themes/_all-themes.scss @@ -1,5 +1,7 @@ $themes: (); +@import "theme-defaults"; @import "dark-brown"; @import "flat-blue"; @import "white"; +@import "high-contrast"; diff --git a/app/styles/themes/_dark-brown.scss b/app/styles/themes/_dark-brown.scss index 909511f2..c345f3cf 100644 --- a/app/styles/themes/_dark-brown.scss +++ b/app/styles/themes/_dark-brown.scss @@ -1,9 +1,9 @@ $themes: map-merge($themes, ( - db: ( + db: map-merge($theme-defaults, ( background-color: #342F2E, medium-color: #FED9D8, text-color: #FFEAE9, action-color: #2C9957, error-color: #FD6D67, - ) + )) )); diff --git a/app/styles/themes/_flat-blue.scss b/app/styles/themes/_flat-blue.scss index e75ac157..f27d241b 100644 --- a/app/styles/themes/_flat-blue.scss +++ b/app/styles/themes/_flat-blue.scss @@ -1,9 +1,9 @@ $themes: map-merge($themes, ( - fb: ( + fb: map-merge($theme-defaults, ( background-color: #282C34, medium-color: #ABB2BF, text-color: #D7DAE0, action-color: #528BFF, error-color: #C34034, - ) + )) )); diff --git a/app/styles/themes/_high-contrast.scss b/app/styles/themes/_high-contrast.scss new file mode 100644 index 00000000..bd313ca3 --- /dev/null +++ b/app/styles/themes/_high-contrast.scss @@ -0,0 +1,12 @@ +$themes: map-merge($themes, ( + hc: map-merge($theme-defaults, ( + background-color: #FAFAFA, + medium-color: #050505, + text-color: #050505, + action-color: #2d72d7, + error-color: #e74859, + mute-percent: 60%, + light-border-percent: 50%, + modal-opacity: 1, + )) +)); diff --git a/app/styles/themes/_theme-defaults.scss b/app/styles/themes/_theme-defaults.scss new file mode 100644 index 00000000..5dc70bd4 --- /dev/null +++ b/app/styles/themes/_theme-defaults.scss @@ -0,0 +1,5 @@ +$theme-defaults: ( + mute-percent: 30%, + light-border-percent: 10%, + modal-opacity: .9, +) diff --git a/app/styles/themes/_white.scss b/app/styles/themes/_white.scss index d3900ec4..dc7d59f8 100644 --- a/app/styles/themes/_white.scss +++ b/app/styles/themes/_white.scss @@ -1,9 +1,9 @@ $themes: map-merge($themes, ( - wh: ( + wh: map-merge($theme-defaults, ( background-color: #FAFAFA, medium-color: #050505, text-color: #424243, action-color: #475FD7, error-color: #E75675, - ) + )) )); diff --git a/release-notes.md b/release-notes.md index a9f08010..54022f67 100644 --- a/release-notes.md +++ b/release-notes.md @@ -8,6 +8,7 @@ Auto-type, ui improvements `+` docker container `+` edit and remove tags `+` register file associations +`+` high contrast theme `-` prevent second app instance on windows `*` don't check updates at startup