diff --git a/src/App.scss b/src/App.scss index 9e549b86..289add77 100644 --- a/src/App.scss +++ b/src/App.scss @@ -411,6 +411,10 @@ nav { --__horizontal-gap: 0.75em; --__vertical-gap: 0.5em; + &.-non-interactive { + cursor: auto; + } + &.-active, &:hover { border-top-width: 1px; diff --git a/src/components/list/list.vue b/src/components/list/list.vue index b8fcaf9d..c885bacd 100644 --- a/src/components/list/list.vue +++ b/src/components/list/list.vue @@ -7,7 +7,7 @@ v-for="item in items" :key="getKey(item)" class="list-item" - :class="getClass(item)" + :class="[getClass(item), nonInteractive ? '-non-interactive' : '']" role="listitem" > '' + }, + nonInteractive: { + type: Boolean, + default: false } } } diff --git a/src/components/list/list_item.style.js b/src/components/list/list_item.style.js index ae8dc5f4..e82a0a83 100644 --- a/src/components/list/list_item.style.js +++ b/src/components/list/list_item.style.js @@ -3,7 +3,7 @@ export default { selector: '.list-item', states: { active: '.-active', - hover: ':hover' + hover: ':hover:not(.-non-interactive)' }, validInnerComponents: [ 'Text', diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue index e54132d6..3d3a5ff0 100644 --- a/src/components/selectable_list/selectable_list.vue +++ b/src/components/selectable_list/selectable_list.vue @@ -29,11 +29,13 @@
- + @@ -87,7 +87,7 @@ :label="$t('user_card.followers')" :disabled="!user.followers_count" > - +