Skip to content
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
Improve accesibility for search tags/chips
- Use stand font of filter tags/chips
- No bold
- Use close icon and no close thick

Signed-off-by: fenn-cs <[email protected]>
  • Loading branch information
nfebe authored and AndyScherzinger committed Nov 29, 2023
commit 1fe7ba57c868fca92deb8ed0e582858dbc5fe50d
18 changes: 11 additions & 7 deletions core/src/components/GlobalSearch/SearchFilterChip.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,28 @@
</span>
<span class="text">{{ text }}</span>
<span class="close-icon" @click="deleteChip">
<CloseIcon :size="16" />
<CloseIcon :size="18" />
</span>
</div>
</template>

<script>
import CloseIcon from 'vue-material-design-icons/CloseThick.vue'
import CloseIcon from 'vue-material-design-icons/Close.vue'

export default {
name: 'SearchFilterChip',
components: {
CloseIcon,
},
props: {
text: String,
pretext: String,
text: {
type: String,
required: true,
},
pretext: {
type: String,
required: true,
},
},
methods: {
deleteChip() {
Expand All @@ -40,8 +46,6 @@ export default {
border-radius: 20px;
background-color: var(--color-primary-element-light);
margin: 2px;
font-size: 10px;
font-weight: bolder;

.icon {
display: flex;
Expand All @@ -61,7 +65,7 @@ export default {
}

.close-icon {
cursor: pointer;
cursor: pointer ;

:hover {
filter: invert(20%);
Expand Down