Legislation Search Component - Copy this Html, Bootstrap Component to your project
Crie uma interface de usuário para uma página de pesquisa de legislação que seja clara, organizada e funcional. A interface deve incluir os seguintes elementos principais: Barra de pesquisa superior: Um campo de texto centralizado com o placeholder "Digite aqui sua busca". Um botão verde à direita do campo de texto com o texto "Buscar" e um ícone de lupa. Área de filtros (lado esquerdo): Um título "Refine sua busca". Vários filtros organizados verticalmente com os seguintes títulos e opções: Abrangência: Legislação Federal (com um contador mostrando 239676). Legislação Interna (com um contador mostrando 1708). Ano: 2024 (com um contador mostrando 766). 2023 (com um contador mostrando 1180). Tipos de Norma: Alvará (245). Portaria (1). Situação: Arquivada (2). Vigente até a Constituição de 1988 (1). Origem: Advocacia Geral da União (5). Senado Federal. Secretaria Geral da Mesa (2). Resultados da pesquisa (lado direito): Uma seção exibindo o número de resultados, como "Exibindo resultados de 1 a 20 de 239676". Um seletor dropdown para ordenar os resultados (mais relevantes, mais recentes, mais antigas). Uma lista de resultados, cada um contendo: Título em negrito, como "Decreto nº 5.112, de 11 de Janeiro de 1904". Ementa resumida explicando a norma. Situação da norma (por exemplo, "Revogada"). A lista de resultados deve ser separada por linhas finas e espaçamentos adequados para uma leitura confortável. Navegação de paginação: Botões de navegação na parte inferior para mudar de página, com as opções "Anterior" e "Próxima". Exibir o número da página atual no centro (por exemplo, "1"). Estilo e cores: A paleta de cores deve ser suave, com predominância de verde, cinza claro, e branco, semelhante ao design de sites governamentais. O botão de busca e o botão de paginação "Próxima" devem ser verdes. As fontes devem ser simples, com boa legibilidade, e as informações importantes como títulos e contadores de resultados devem estar em negrito.
