Use <input type="search"> for search bar
This commit is contained in:
parent
318bbbdf7d
commit
7b2c4e83a5
2 changed files with 9 additions and 3 deletions
|
@ -9,7 +9,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
### Changed
|
||||
|
||||
- Remove invisible characters from display names.
|
||||
- Use `/api/v1/{status_id}/thread` API endpoint to load threads.
|
||||
- Use `/api/v1/statuses/{status_id}/thread` API endpoint to load threads.
|
||||
- Use `<input type="search">` for search bar.
|
||||
|
||||
## [1.13.0] - 2023-02-06
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<form class="search" @submit.prevent="search()">
|
||||
<input type="text" placeholder="Search..." v-model="q">
|
||||
<input type="search" placeholder="Search..." v-model="q">
|
||||
<button v-if="q" type="button" @click="clear()">
|
||||
<img :src="require('@/assets/feather/delete.svg')">
|
||||
</button>
|
||||
|
@ -38,7 +38,8 @@ function search() {
|
|||
padding: 7px 15px;
|
||||
}
|
||||
|
||||
input {
|
||||
input[type="search"] {
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
|
@ -48,6 +49,10 @@ input {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button {
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
button {
|
||||
border-radius: 0 $btn-border-radius $btn-border-radius 0;
|
||||
font-size: 15px;
|
||||
|
|
Loading…
Reference in a new issue