1
0
Fork 0
mirror of https://framagit.org/framasoft/mobilizon.git synced 2025-03-12 09:32:48 +00:00

Improves the displaying of the search zone in /search page and home page

Solves #1679
This commit is contained in:
Massedil 2025-02-13 20:01:49 +01:00
parent def786b99e
commit c808708911
2 changed files with 70 additions and 73 deletions

View file

@ -1,14 +1,16 @@
<template>
<form
id="search-anchor"
class="container mx-auto my-3 px-2 flex flex-wrap flex-col sm:flex-row items-stretch gap-2 text-center justify-center dark:text-slate-100"
class="container mx-auto p-2 flex flex-col flex-wrap items-stretch gap-2 justify-center dark:text-slate-100"
role="search"
@submit.prevent="submit"
>
<div class="flex flex-col flex-wrap sm:flex-row gap-2 justify-center">
<label class="sr-only" for="search_field_input">{{
t("Keyword, event title, group name, etc.")
}}</label>
<o-input
class="min-w-48"
v-if="search != null"
v-model="search"
:placeholder="t('Keyword, event title, group name, etc.')"
@ -47,20 +49,17 @@
/>
</o-dropdown>
</full-address-auto-complete>
</div>
<div class="flex flex-col flex-wrap sm:flex-row gap-2 justify-center">
<o-button
:class="
'search-Event min-w-40 mr-1 mb-1 ' + select_button_class('EVENTS')
"
:class="'search-Event min-w-40 ' + select_button_class('EVENTS')"
native-type="submit"
icon-left="calendar"
>
{{ t("Events") + number_result("EVENTS") }}
</o-button>
<o-button
:class="
'search-Activity min-w-40 mr-1 mb-1 ' +
select_button_class('LONGEVENTS')
"
:class="'search-Activity min-w-40 ' + select_button_class('LONGEVENTS')"
native-type="submit"
icon-left="calendar-star"
v-if="isLongEvents"
@ -68,14 +67,13 @@
{{ t("Activities") + number_result("LONGEVENTS") }}
</o-button>
<o-button
:class="
'search-Group min-w-40 mr-1 mb-1 ' + select_button_class('GROUPS')
"
:class="'search-Group min-w-40 ' + select_button_class('GROUPS')"
native-type="submit"
icon-left="account-multiple"
>
{{ t("Groups") + number_result("GROUPS") }}
</o-button>
</div>
</form>
</template>

View file

@ -1,7 +1,6 @@
<template>
<div class="max-w-4xl mx-auto">
<search-fields
class="md:ml-10 mr-2"
v-model:search="search"
v-model:address="address"
v-model:distance="radius"