¡Me encanta esta idea! Estaré encantado de revisar y fusionar un PR que implemente esta función 
11 Me gusta
Me encanta esta idea 
Así que acabo de probarla un poco. Creo que hay una forma mucho mejor de implementarlo, pero por ahora funciona bastante bien en mi sitio. 
Utilizo el código del componente Big Header - Little Header dentro de <head> de la plantilla para lograr esto.
Lamentablemente, en iPhone hay una limitación porque la barra de navegación inferior oculta por completo la barra de pestañas de Discourse. Por eso, la oculto.
¡He actualizado este código!
Ahora solo comparto el código aquí (no estoy seguro de si es fusionable):
Coloca esto en la sección <head> para móviles:
<script type="text/discourse-plugin" version="0.8.18">
$(document).ready(function() {
var lastScrollTop = 0;
var body = $("body");
var scrollMax = 30;
$(window).scroll(function() {
var scroll = $(this).scrollTop();
if (lastScrollTop < scroll && scroll > scrollMax && !body.hasClass("tab-bar-hidden")) {
body.addClass("tab-bar-hidden");
} else if (lastScrollTop > scroll && body.hasClass("tab-bar-hidden")) {
body.removeClass("tab-bar-hidden");
}
lastScrollTop = scroll;
});
});
</script>
Coloca esto en la sección de CSS para móviles:
html:not(.anon) {
#topic-progress-wrapper,
#reply-control.draft {
bottom: 49px;
}
#reply-control.draft {
margin-bottom: env(safe-area-inset-bottom);
padding-bottom: 0px;
transition: all .1s ease-out;
}
.posts-filtered-notice {
transition: all .1s ease-out;
bottom: 49px;
}
}
body.tab-bar-hidden {
.d-tab-bar {
bottom: -49px;
transition: all .2s ease-in;
}
#topic-progress-wrapper:not(.docked),
#reply-control.draft {
bottom: 0;
transition: all .2s ease-in;
}
#reply-control.draft {
margin-bottom: env(safe-area-inset-bottom);
padding-bottom: 0px;
transition: all .2s ease-in;
}
.posts-filtered-notice {
transition: all .2s ease-in;
bottom: 0;
}
}
.d-tab-bar {
transition: all .1s ease-out;
}
body:not(.footer-nav-ipad) .footer-nav {
display: none;
}
Demo
17 Me gusta
¡Qué cosa tan genial has hecho!
5 Me gusta
Un componente muy útil, ¡gracias!
¿Existe alguna forma de que los usuarios individuales lo personalicen o lo oculten por completo?
5 Me gusta
¡Esto es genial, @Don, gracias! Acabo de subir tu código (con pequeñas modificaciones) al componente.
No hay una opción integrada para que los usuarios individuales personalicen u oculten el componente, pero hay una solución alternativa en el núcleo de Discourse que puedes utilizar para permitir que los usuarios individuales oculten el componente: puedes crear una variación de tu tema principal que no incluya este componente y luego poner esa variación a disposición de tus usuarios para que la seleccionen en Preferencias → Interfaz.
Así es como se vería:
Los usuarios que no quieran este componente pueden elegir Grey Amber (sin barra de pestañas), que está configurado exactamente igual que Grey Amber, pero sin incluir el componente de la barra de pestañas.
6 Me gusta
¡Gran idea! ¡Gracias por eso!
4 Me gusta
¡Gracias @Osama, esto es increíble!
He notado un problema en el CSS. La barra de pestañas de Discourse puede activarse y empujar hacia arriba el editor. Creo que solo debería activarse en #reply-control.draft en lugar de en todo #reply-control.
4 Me gusta
¡Ok, debería estar solucionado ahora. ¡Gracias por avisarme! 
6 Me gusta
Solo quería dar las gracias de corazón por esto, es un aporte genial para cualquier sitio de Discourse. @discoverearth, ¿lograste que esto se muestre de forma permanente a todos los usuarios?
5 Me gusta
Estoy intentando configurar esto para hacer clic en las pestañas mientras el usuario navega por la plataforma. En este caso de uso, estoy configurando botones que abren las pestañas de los plugins Kanban, Calendario y Votación.
Kanban:
Si estoy en una categoría o subcategoría y agrego ‘?board=default’ a la URL, navega a la pestaña de Kanban (Tablero), así que debería ser posible. El problema es que este plugin utiliza la ruta relativa desde la raíz, en lugar de la ruta en la que se encuentra actualmente el usuario.
(también tendré que encontrar una solución alternativa para la página de inicio, ya que la lógica de la URL allí es diferente).
Calendario:
La pestaña de Calendario necesita agregar ‘/l/calendar’ al final de la URL.
Eso parece posible, pero también necesita eliminar cualquier texto en la URL que esté por encima de la categoría o subcategoría en la que se encuentra el usuario. Por ejemplo, si un usuario ha navegado a ‘latest’ o ‘kanban’, esa parte de la URL debe eliminarse antes de agregar ‘/l/calendar’ al final.
¿Alguien tiene alguna idea sobre cómo hacerlo, ya que sería increíble poder usar esto con esos plugins? El selector de pestañas está básicamente oculto en móviles ahora, lo cual no es bueno para sitios que utilizan componentes como Kanban o Calendario de manera intensiva.
1 me gusta
Este plugin es un buen trabajo, pero no se puede usar con DiscourseHub (al menos en iPhone) porque oculta la pestaña de navegación en la misma posición. Por lo tanto, no se puede cambiar de foro.
Así que esto solo es útil para foros que de alguna manera no permiten DiscourseHub o que arruinan la experiencia de usuario al enseñar a cerrar la aplicación por completo después de visitar un foro 
Claro, alguien que sepa programar podría mostrar esta barra de pestañas solo cuando se usa un navegador… pero enseñar a un usuario a tener una interfaz de usuario diferente en el mismo dispositivo es realmente una mala idea.
Con este componente:
Y con DiscourseHub puro:
3 Me gusta
¿Sabes de qué foro se trata? ¡Me encanta absolutamente la interfaz de usuario!
3 Me gusta
Me encantaría poder tener el botón de notificaciones con las notificaciones rojas mencionadas, como en el botón del menú superior en la versión predeterminada. ¿Podrías darme una pista sobre cómo hacerlo? No soy muy bueno programando.
@nildarar, ¿lograste que el contador de notificaciones apareciera en el botón? Gracias.
1 me gusta
¡Hola! Me encanta este concepto. Gracias.
Una pregunta: preferiría usar la versión contorneada de los iconos de FontAwesome en lugar de las versiones rellenas, para ser más consistente con otras áreas de mi sitio web.
¿Hay alguna manera de especificar eso? Por lo general, usar el nombre completo de un icono, por ejemplo, far fa-star (en lugar de solo star), marcaría esa distinción. Pero cada vez que intento poner el nombre completo de un icono así, el componente no muestra nada en su lugar.
¿Hay alguna manera de lograr eso?
1 me gusta
Esto se ve muy bien. ¿Hay alguna forma de crear una pestaña para mostrar el feed de seguidores? De esta manera, un usuario puede ver fácilmente un feed de todas las personas que sigue.
¿También es posible para páginas específicas?
.user-main .about {
margin-bottom: 0;
color: var(--secondary);
display: none;
}
¿Solo para la página del feed?
1 me gusta
Solo para confirmar, ¿te refieres al feed de seguimiento de Discourse Follow? Si es así, entonces establece feed como la ruta (el tercer segmento) en la configuración de la pestaña a la que deseas redirigir al feed de seguimiento.
4 Me gusta
Sí, lo estoy. ¡Gracias!
3 Me gusta
Creo que sería bueno si pudiéramos agregar un botón de “Nuevo tema” justo en medio de la barra. 
Reddit sirve como un gran ejemplo.
6 Me gusta
Claro que sí. Prueba lo siguiente en la configuración de la tercera o cuarta pestaña para lograr el efecto central.
New, plus, /new-topic
6 Me gusta
