tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Responsiveness improvements to date and numeric filter.

This commit is contained in:
mateuswetah 2024-06-14 09:46:09 -03:00
parent f1fede5959
commit 1b1b2aa38d
5 changed files with 39 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/admin/components/filter-types/checkbox/TainacanFilterCheckbox.vue
View File

@ -26,7 +26,7 @@
hide: 100,
},
content: option.label,
autoHide: trie,
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"

10
src/views/admin/components/filter-types/date/TainacanFilterDate.vue
View File

@ -215,8 +215,16 @@
.date-filter-container {
display: flex;
height: auto;
align-items: stretch;
@media screen and (min-width: 769px) and (max-width: 1500px) {
@supports not (contain: inline-size) {
@media screen and (min-width: 769px) and (max-width: 1500px) {
flex-wrap: wrap;
height: 60px;
}
}
@container filterscomponentslist (max-width: 170px) {
flex-wrap: wrap;
height: 60px;
}

16
src/views/admin/components/filter-types/numeric/TainacanFilterNumeric.vue
View File

@ -157,15 +157,25 @@
height: auto;
align-items: stretch;
@media screen and (min-width: 769px) and (max-width: 1500px) {
@supports not (contain: inline-size) {
@media screen and (min-width: 769px) and (max-width: 1500px) {
flex-wrap: wrap;
height: 60px;
}
}
@container filterscomponentslist (max-width: 170px) {
flex-wrap: wrap;
align-items: stretch;
height: 60px;
.dropdown {
flex-grow: 2 !important;
}
}
.dropdown {
width: auto;
flex-grow: 2;
flex-grow: 0;
.dropdown-trigger button {
padding: 2px 0.5em 2px 0.5em !important;

11
src/views/admin/components/filter-types/taxonomy/TainacanFilterCheckbox.vue
View File

@ -21,7 +21,16 @@
<span class="check" />
<span class="control-label">
<span
:title="option.label"
v-tooltip="{
delay: {
show: 800,
hide: 100,
},
content: option.label,
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="checkbox-label-text">
{{ option.label }}
</span>

6
src/views/admin/components/search/filters-items-list.vue
View File

@ -492,6 +492,12 @@
.filters-components-list {
margin-bottom: 64px;
}
@supports (contain: inline-size) {
.filters-components-list {
container-type: inline-size;
container-name: filterscomponentslist;
}
}
.collection-name {
color: var(--tainacan-heading-color);
font-size: 0.875em;