Buck9195/doesitarm
1
0
Fork 0
mirror of https://github.com/ThatGuySam/doesitarm.git synced 2026-05-18 06:44:46 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Put list end buttons into stork search

Browse source
This commit is contained in:
Sam Carlton 2022-06-07 14:04:32 -05:00
parent 2493e01145
commit 45709aed10
2 changed files with 31 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

38
components/search-stork.vue
View file

@ -18,7 +18,7 @@
<input <input
id="search" id="search"
ref="search" ref="search"
v-model="query" v-model="userTextQuery"
:autofocus="autofocus" :autofocus="autofocus"
aria-label="Type here to Search" aria-label="Type here to Search"
class="appearance-none w-full text-white font-hairline sm:text-5xl outline-none bg-transparent p-3" class="appearance-none w-full text-white font-hairline sm:text-5xl outline-none bg-transparent p-3"
@ -87,12 +87,28 @@
<div <div
v-if="baseFilters.length > 0" v-if="baseFilters.length > 0"
class="w-full flex justify-center p-8" class="w-full flex justify-center p-6"
> >
<LinkButton <LinkButton
href="/" href="/"
:class="[
'px-3 py-2 rounded-md text-sm pointer-events-auto focus:outline-none focus:text-white focus:bg-gray-700 transition duration-150 ease-in-out',
'text-gray-300 hover:bg-darker hover:neumorphic-shadow'
]"
:class-groups="{
shadow: 'hover:neumorphic-shadow',
bg: 'hover:bg-darker',
}"
> >
<span>Search everything</span> <span>Search everything</span>
<svg
class="h-5 w-5"
viewBox="0 0 20 20"
fill="currentColor"
>
<use href="#chevron-right" />
</svg>
</LinkButton> </LinkButton>
</div> </div>
</template> </template>
@ -288,6 +304,12 @@
</ul> </ul>
</div> </div>
<div class="list-end-area flex justify-center py-6">
<ListEndButtons
:query="userTextQuery"
/>
</div>
</div> </div>
</template> </template>
@ -311,6 +333,7 @@ import Carbon from '~/components/carbon-inline.vue'
import LinkButton from '~/components/link-button.vue' import LinkButton from '~/components/link-button.vue'
import RelativeTime from '~/components/relative-time.vue' import RelativeTime from '~/components/relative-time.vue'
import ListSummary from '~/components/list-summary.vue' import ListSummary from '~/components/list-summary.vue'
import ListEndButtons from '~/components/list-end-buttons.vue'
let storkClient = null let storkClient = null
@ -320,6 +343,7 @@ export default {
ListSummary, ListSummary,
RelativeTime, RelativeTime,
LinkButton, LinkButton,
ListEndButtons
}, },
props: { props: {
kindPage: { kindPage: {
@ -349,7 +373,7 @@ export default {
}, },
data: function () { data: function () {
return { return {
query: '', userTextQuery: '',
filterQueryList: [], filterQueryList: [],
hasStartedAnyQuery: false, hasStartedAnyQuery: false,
listingsResults: [], listingsResults: [],
@ -359,7 +383,7 @@ export default {
computed: { computed: {
storkQuery () { storkQuery () {
return [ return [
this.query.trim(), this.userTextQuery.trim(),
...this.filterQueryList ...this.filterQueryList
].join(' ') ].join(' ')
}, },
@ -396,7 +420,7 @@ export default {
return this.baseFilters.length > 0 return this.baseFilters.length > 0
}, },
hasSearchInputText () { hasSearchInputText () {
return this.query.length > 0 return this.userTextQuery.length > 0
}, },
hasAnyUserFilters () { hasAnyUserFilters () {
return this.userFilters.length > 0 return this.userFilters.length > 0
@ -408,7 +432,7 @@ export default {
return !this.hasAnyUserTerms return !this.hasAnyUserTerms
}, },
inputTerms () { inputTerms () {
return this.query.trim().split(' ') return this.userTextQuery.trim().split(' ')
}, },
userFilters () { userFilters () {
// console.log('filterQueryList', ) // console.log('filterQueryList', )
@ -487,7 +511,7 @@ export default {
// Called on input and when a filter is toggled // Called on input and when a filter is toggled
async queryResults ( rawQuery ) { async queryResults ( rawQuery ) {
// console.log( 'query', this.storkQuery ) console.log( 'query', this.storkQuery )
// If our query is empty // If our query is empty
// then bail // then bail

2
src/pages/index.astro
View file

@ -51,8 +51,6 @@ const allAppsSummary = await DoesItAPI('all-apps-summary').get()
client:load client:load
/> />
<ListEndButtons query="query" />
<AllUpdatesSubscribe <AllUpdatesSubscribe
class="my-12" class="my-12"
/> />