Sección de búsqueda como en Reddit?

Desarrollador
1

Hola a todos,

¿Puedo añadir un campo de búsqueda como este a mi sitio?
Y quiero eliminar el botón de búsqueda del lado derecho.
Gracias :slight_smile:

redditsearch
Ekran görüntüsü 2024-03-28 151903

2

Banner de búsqueda, ¿quizás? Pero buscar podría ser una buena forma de encontrar algunas soluciones potenciales. :wink:

3
5

Muchas gracias.
¿Podemos ovalar los bordes de la caja?
@Moin

Como aquí.
¿Y podemos pintar el interior?
Con efecto hover como en reddit
Ekran görüntüsü 2024-03-28 151903

6

Puedes personalizarlo con CSS.

7

@Moin gracias Moin pero no puedo hacer esto, así que te pido ayuda.
Vi sus videos, lo intenté muchas veces y no funciona.
Lo intenté en Firefox y Chrome.

8

Si estás intentando aprender a personalizar tu foro, tómate un tiempo para aprender los conceptos básicos de temas, componentes y CSS. Alternativamente, siempre puedes publicar en Marketplace para obtener ayuda pagada para personalizar tu foro.

9

Este componente de tema de #personalización podría ayudar:

Este otro para los estilos de los botones:

10

Hola amigos, veo que intentan ayudarme pero no puedo escribir código.
Si hay código listo, solo puedo arreglarlo.
Si hay alguien que pueda ayudar, esperaré.
Gracias.
Lo que a ustedes les parece fácil, a mí me resulta difícil, los códigos son demasiado complicados para mí.

11

Ekran görüntüsü 2024-03-29 173859
Ekran görüntüsü 2024-03-29 1738592507×238 27.5 KB

No está exactamente en el medio.
Y se ve muy mal para mí.
Me estoy enfadando porque no puedo editar, pero no hay nada que hacer :smiley:
La búsqueda original de Reddit se ve genial.
Por supuesto que es Reddit. Pero me gustaría poder hacer esto al menos con una similitud cercana.

12

Ahora soy un programador :sunglasses: :grin:

.floating-search-input .search-banner-inner.wrap .search-menu .search-input {
    border-radius: 10px;
    background-color: #3e3e58;
    border: 0px solid;
}

.floating-search-input .search-banner-inner.wrap .search-menu .search-input:hover {
    background-color: #4c4c6b;
}
13

¡Hola a todos!

.search-menu.menu-panel-results, .search-menu-container.menu-panel-results {
    width: 600px;
    left: 150px;
}

.floating-search-input .search-banner-inner.wrap .search-menu .search-icon {
    left: 150px;
}

Escribí estos códigos, cuando los agrego al campo CSS, se ve como quiero, pero no se ve así en otros.
¿Me pueden ayudar por favor?
https://pvpfarm.com

Ekran görüntüsü 2024-03-31 132713

14

Y quiero expandir un poco hacia arriba el tamaño del cuadro de búsqueda. No pude encontrarlo, ¿alguien puede encontrarlo?

15

Solo para tu información @ogulcan1787, esto parece estar al borde de:

¿Has estado investigando estos problemas fuera de este foro? Creo que hay muchos recursos disponibles.

16

Sí, estoy buscando pero no lo encuentro.
https://developer.mozilla.org/ Utilizo ese sitio.

17

¿me parece bien? :thinking:

IMG_1478
IMG_14782347×642 157 KB

¿Buscaste en ese sitio cómo centrar?

Yo prefiero este sitio: