- Use stand font of filter tags/chips
- No bold
- Use close icon and no close thick
Signed-off-by: fenn-cs <fenn25.fn@gmail.com>
</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',
CloseIcon,
},
props: {
- text: String,
- pretext: String,
+ text: {
+ type: String,
+ required: true,
+ },
+ pretext: {
+ type: String,
+ required: true,
+ },
},
methods: {
deleteChip() {
border-radius: 20px;
background-color: var(--color-primary-element-light);
margin: 2px;
- font-size: 10px;
- font-weight: bolder;
.icon {
display: flex;
}
.close-icon {
- cursor: pointer;
+ cursor: pointer ;
:hover {
filter: invert(20%);