#1680 Improved display of the search bar

This commit is contained in:
Massedil
2025-02-14 13:21:14 +01:00
parent c808708911
commit c154ff9ba8

View File

@@ -1,17 +1,17 @@
<template> <template>
<form <form
id="short-search" id="short-search"
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-wrap flex-col sm:flex-row items-stretch gap-2 justify-center dark:text-slate-100"
role="search" role="search"
@submit.prevent="submit" @submit.prevent="submit"
> >
<label class="sr-only" for="short_search_field_input">{{ <label class="sr-only" for="short_search_field_input">{{
t("Keyword, event title, group name, etc.") t("Keyword, event title, group name, etc.")
}}</label> }}</label>
<div class="flex-auto sm:max-w-xl">
<o-input <o-input
v-model="search" v-model="search"
:placeholder="t('Keyword, event title, group name, etc.')" :placeholder="t('Keyword, event title, group name, etc.')"
class="max-w-md"
id="short_search_field_input" id="short_search_field_input"
autofocus autofocus
autocapitalize="off" autocapitalize="off"
@@ -20,8 +20,9 @@
maxlength="1024" maxlength="1024"
expanded expanded
/> />
</div>
<o-button <o-button
class="search-Event min-w-40 mr-1 mb-1" class="search-Event min-w-40 sm:w-auto"
native-type="submit" native-type="submit"
icon-left="magnify" icon-left="magnify"
> >