diff --git a/app/assets/javascripts/repositories/show.js b/app/assets/javascripts/repositories/show.js
index dece2dda0..bb574196a 100644
--- a/app/assets/javascripts/repositories/show.js
+++ b/app/assets/javascripts/repositories/show.js
@@ -202,6 +202,10 @@
$('#modalSaveRepositoryTableFilter #repository_table_filter_name').val('');
});
+ $('#modalSaveRepositoryTableFilter').on('shown.bs.modal', function() {
+ $('#repository_table_filter_name').focus();
+ });
+
$(document).on('click', '#overwriteFilterLink', function() {
var $modal = $('#modalSaveRepositoryTableFilter');
@@ -213,6 +217,7 @@
$modal.removeData('overwrite');
});
+
$('#modalSaveRepositoryTableFilter #repository_table_filter_name')
.val($modal.data('repositoryTableFilterName'));
});
diff --git a/app/assets/javascripts/sitewide/dropdown_selector.js b/app/assets/javascripts/sitewide/dropdown_selector.js
index a9d441a97..9f764ae24 100644
--- a/app/assets/javascripts/sitewide/dropdown_selector.js
+++ b/app/assets/javascripts/sitewide/dropdown_selector.js
@@ -520,6 +520,7 @@ var dropdownSelector = (function() {
var customStyle = selector2.data('config').optionStyle;
return $(`
diff --git a/app/assets/stylesheets/repository/filters.scss b/app/assets/stylesheets/repository/filters.scss
index ab173df16..8a029e6d7 100644
--- a/app/assets/stylesheets/repository/filters.scss
+++ b/app/assets/stylesheets/repository/filters.scss
@@ -6,15 +6,22 @@
position: relative;
&::after {
- background: $brand-accent;
+ background: $brand-danger;
border-radius: 50%;
+ border: 2px solid $color-white;
content: "";
display: block;
- height: 8px;
+ height: 10px;
position: absolute;
right: .3em;
top: .3em;
- width: 8px;
+ width: 10px;
+ }
+
+ &:hover {
+ &::after {
+ border-color: $color-concrete;
+ }
}
}
@@ -129,7 +136,7 @@
.filters-list {
flex-grow: 1;
overflow-y: auto;
- padding: .5em;
+ padding: .5em 1em;
}
.filter-container {
@@ -150,11 +157,31 @@
grid-auto-flow: column;
grid-template-columns: min-content auto;
+ .between-delimiter {
+ align-self: center;
+
+ &.vertical {
+ background-color: $color-silver-chalice;
+ height: 12px;
+ margin: auto;
+ width: 2px;
+ }
+ }
+
+ .number-range-selector {
+ align-items: center;
+ display: grid;
+ gap: .5em;
+ grid-auto-flow: column;
+ }
+
.dropdown-selector-container {
width: 100%;
}
.operator-selector {
+ height: 2em;
+
.dropdown-selector-container {
width: 120px;
}
@@ -183,6 +210,14 @@
.filter-remove {
margin-left: auto;
+
+ .icon-btn {
+ color: $color-silver-chalice;
+
+ &:hover {
+ color: $color-black;
+ }
+ }
}
}
}
@@ -195,3 +230,24 @@
padding-left: 1.5em;
}
}
+
+
+#saveRepositoryFilters {
+ .dropdown-menu {
+ width: 320px;
+
+ .overwrite-link {
+ align-items: center;
+ display: flex;
+
+ .fa-save {
+ flex-shrink: 0;
+ margin-right: .25em;
+ }
+
+ .overwrite-title {
+ white-space: normal;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/javascript/vue/repository_filter/container.vue b/app/javascript/vue/repository_filter/container.vue
index 9ee9e2cf7..f32049604 100644
--- a/app/javascript/vue/repository_filter/container.vue
+++ b/app/javascript/vue/repository_filter/container.vue
@@ -143,6 +143,7 @@
},
toggleSavedFilters(e) {
e.stopPropagation();
+ $('.saved-filters-list').scrollTo(0);
if (this.savedFilterScrollbar) {
this.savedFilterScrollbar.update();
} else {
diff --git a/app/javascript/vue/repository_filter/filters/repositoryDateRangeValue.vue b/app/javascript/vue/repository_filter/filters/repositoryDateRangeValue.vue
index 9976b64d7..2017f081e 100644
--- a/app/javascript/vue/repository_filter/filters/repositoryDateRangeValue.vue
+++ b/app/javascript/vue/repository_filter/filters/repositoryDateRangeValue.vue
@@ -11,6 +11,7 @@
+
—
diff --git a/app/javascript/vue/repository_filter/filters/repositoryDateTimeRangeValue.vue b/app/javascript/vue/repository_filter/filters/repositoryDateTimeRangeValue.vue
index dd762349b..7bd9783f7 100644
--- a/app/javascript/vue/repository_filter/filters/repositoryDateTimeRangeValue.vue
+++ b/app/javascript/vue/repository_filter/filters/repositoryDateTimeRangeValue.vue
@@ -12,6 +12,7 @@
+
diff --git a/app/javascript/vue/repository_filter/filters/repositoryDateTimeValue.vue b/app/javascript/vue/repository_filter/filters/repositoryDateTimeValue.vue
index 9a5657bd4..e31cda539 100644
--- a/app/javascript/vue/repository_filter/filters/repositoryDateTimeValue.vue
+++ b/app/javascript/vue/repository_filter/filters/repositoryDateTimeValue.vue
@@ -13,6 +13,7 @@
+
@@ -34,12 +35,25 @@
return {
timeType: 'datetime',
operators: [
- { value: 'today', label: this.i18n.t('repositories.show.repository_filter.filters.operators.today') },
- { value: 'yesterday', label: this.i18n.t('repositories.show.repository_filter.filters.operators.yesterday') },
- { value: 'last_week', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_week') },
- { value: 'this_month', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_month') },
- { value: 'this_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_year') },
- { value: 'last_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_year') },
+ { value: 'today', label: this.i18n.t('repositories.show.repository_filter.filters.operators.today'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.today')
+ } },
+ { value: 'yesterday', label: this.i18n.t('repositories.show.repository_filter.filters.operators.yesterday'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.yesterday')
+ } },
+ { value: 'last_week', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_week'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.last_week')
+ } },
+ { value: 'this_month', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_month'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.this_month')
+ } },
+ { value: 'this_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_year'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.this_year')
+ } },
+ { value: 'last_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_year'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.last_year')
+ } },
+ { value: '', label: '', params: { delimiter: true } },
{ value: 'equal_to', label: this.i18n.t('repositories.show.repository_filter.filters.operators.equal_to') },
{ value: 'unequal_to', label: this.i18n.t('repositories.show.repository_filter.filters.operators.unequal_to') },
{ value: 'greater_than', label: this.i18n.t('repositories.show.repository_filter.filters.operators.greater_than') },
diff --git a/app/javascript/vue/repository_filter/filters/repositoryDateValue.vue b/app/javascript/vue/repository_filter/filters/repositoryDateValue.vue
index b13cf758a..9ebe97f79 100644
--- a/app/javascript/vue/repository_filter/filters/repositoryDateValue.vue
+++ b/app/javascript/vue/repository_filter/filters/repositoryDateValue.vue
@@ -12,6 +12,7 @@
+
—
@@ -32,12 +33,25 @@
return {
timeType: 'date',
operators: [
- { value: 'today', label: this.i18n.t('repositories.show.repository_filter.filters.operators.today') },
- { value: 'yesterday', label: this.i18n.t('repositories.show.repository_filter.filters.operators.yesterday') },
- { value: 'last_week', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_week') },
- { value: 'this_month', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_month') },
- { value: 'this_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_year') },
- { value: 'last_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_year') },
+ { value: 'today', label: this.i18n.t('repositories.show.repository_filter.filters.operators.today'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.today')
+ } },
+ { value: 'yesterday', label: this.i18n.t('repositories.show.repository_filter.filters.operators.yesterday'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.yesterday')
+ } },
+ { value: 'last_week', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_week'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.last_week')
+ } },
+ { value: 'this_month', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_month'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.this_month')
+ } },
+ { value: 'this_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.this_year'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.this_year')
+ } },
+ { value: 'last_year', label: this.i18n.t('repositories.show.repository_filter.filters.operators.last_year'), params: {
+ tooltip: this.i18n.t('repositories.show.repository_filter.filters.operators.tooltips.last_year')
+ } },
+ { value: '', label: '', params: { delimiter: true } },
{ value: 'equal_to', label: this.i18n.t('repositories.show.repository_filter.filters.operators.equal_to') },
{ value: 'unequal_to', label: this.i18n.t('repositories.show.repository_filter.filters.operators.unequal_to') },
{ value: 'greater_than', label: this.i18n.t('repositories.show.repository_filter.filters.operators.greater_than') },
diff --git a/app/javascript/vue/repository_filter/filters/repositoryNumberValue.vue b/app/javascript/vue/repository_filter/filters/repositoryNumberValue.vue
index 68c540db4..e9bc3faf8 100644
--- a/app/javascript/vue/repository_filter/filters/repositoryNumberValue.vue
+++ b/app/javascript/vue/repository_filter/filters/repositoryNumberValue.vue
@@ -18,23 +18,21 @@
:placeholder= "this.i18n.t('repositories.show.repository_filter.filters.types.RepositoryNumberValue.input_placeholder',{name: this.filter.column.name})"
/>
-