Anidar subcategorías bajo sus categorías principales en la barra lateral

Estoy de acuerdo con esto. ¿Hubo alguna actualización sobre esto? ¿O la habrá en un futuro cercano?

2 Me gusta

No tenemos planes inmediatos para realizar cambios adicionales aquí.

Tenga en cuenta que ahora puede ver que las subcategorías se ordenan debajo de su elemento principal (por ejemplo, las subcategorías de Documentation en meta):

Además, la interfaz de usuario para seleccionar categorías ha cambiado desde que comenzó esta discusión, y dentro de ese cuadro de diálogo, las subcategorías están anidadas.

Esto debería ayudar a hacerlas más visibles para las personas que eligen cuáles agregar a su barra lateral.

3 Me gusta

¡Saludos!

Por serendipia, me topé con este artículo. Su parecido con mi composición escrita anteriormente es asombroso.
https://meta.discourse.org/t/navigation-menu-sidebar-modifier/267354/24?u=aizada_m

Tengo curiosidad por saber: ¿el equipo de Discourse ha previsto soluciones para este asunto, o se puede considerar que el problema está resuelto?

No lo sé con certeza, pero siento que si la categoría principal se muestra, entonces quizás las subcategorías se puedan seleccionar con CSS para que se identifiquen y proporcionen una apariencia anidada. ¿Se podría usar un pseudo-elemento ::before? :woman_shrugging:t2:

Quizás vea lo que puedo hacer con uno de mis componentes de menú de navegación cuando los actualice. Tengo la lógica en mi mente de cómo podría lograrse, pero no estoy seguro de si es realmente posible. En mis sueños, no solo las subcategorías están anidadas, sino que también es posible colapsar las subcategorías en sus categorías principales haciendo clic en el punto. :laughing: :exploding_head:

5 Me gusta

Me uno para recibir notificaciones si ocurren cambios, ya que también tenemos demasiadas subcategorías para presentar en la barra lateral sin construir una torre, lo que arruina la mejora de la experiencia de usuario que aporta la barra lateral.

La mejor solución que tenemos ahora es que los usuarios elijan sus grupos y solo vean las categorías relacionadas con esos grupos, más una por defecto, lo que funciona hasta que un usuario selecciona demasiados y construye una torre en su barra lateral.

@Lilly si ese método no funciona, me preguntaba si ya existe la herramienta para crear categorías anidadas.

¿Se podría indicar al módulo “Agregar sección personalizada” que agregue automáticamente todas las categorías de nivel superior como sus propias secciones y que incluya sus subcategorías debajo?

Este método daría a los usuarios un excelente control sobre su barra lateral, ya que todos tendrían una función de edición incorporada.
La desventaja es que los usuarios perderían el icono de la caja de color para la categoría y, probablemente, la función que muestra cuántas publicaciones nuevas hay en cada sección.

2 Me gusta

¿Hubo alguna vez una solución a esto?

Parece una locura que todo lo que podamos tener sea una lista enorme y larga… ni siquiera parece haber ninguna clase añadida a las subcategorías que podamos estilizar manualmente con una pequeña sangría.

Busco conseguir algo parecido a lo siguiente:

Marketing ⌄

  • Centralidad del cliente
  • Tecnología
  • Herramientas

No lo sé, he estado pensando mucho en esto últimamente: quiero decir, toda la sección de categorías es personalizable por usuarios individuales y esta es la forma preferida y debería fomentarse. Dado que se pueden agregar subcategorías sin sus categorías principales y tienen viñetas de color medio para indicar su estado de subcategoría, creo que la lista anidada/indentada realmente no vale la pena, especialmente dada la ardua y difícil tarea de programación para lograrla. Desde una perspectiva funcional, quizás la idea de categorías principales colapsables (como la sección Más, por ejemplo) al hacer clic en la viñeta me parece más atractiva que la indentación, aunque es un esfuerzo de programación aún más difícil. :thinking:

2 Me gusta

Entonces, utiliza los IDs de las subcategorías, que son algo molestos pero funcionales:

li.sidebar-section-link-wrapper {
  &[data-category-id="10"], /*subcategory ID*/
  &[data-category-id="11"], /*subcategory ID*/
  &[data-category-id="12"], /*subcategory ID*/
  &[data-category-id="13"]  /*subcategory ID*/ {
    margin-left: 1em;
  }
}

8 Me gusta

¡Oh, esta es una solución genial! ¡Gracias por compartir! :raised_hands:. Mi pregunta es, ¿es posible hacer algo similar con enlaces normales en la barra lateral? :sweat_smile:

Abre tu consola de desarrollador y echa un vistazo al registro data-list-item-name:

Luego puedes apuntarlos en tu CSS, por ejemplo:

li.sidebar-section-link-wrapper {
  &[data-list-item-name="New"], 
  &[data-list-item-name="Global leaderboard"], 
  &[data-list-item-name="Test leaderboard"] {
    margin-left: 1em;
  }
}

Con un enfoque similar puedes mover una sección completa en lugar de enlaces individuales:

.sidebar-section-wrapper.sidebar-section[data-section-name="new-global-links-section"] {
    margin-left: 1em;
}

6 Me gusta

Hola @dax! Por favor, perdóname por la larga respuesta :pray:
Sí, es magia :sparkles: y funciona, he estado buscando una solución como esta durante los últimos 3 meses, te estoy profundamente agradecido :raised_hands:

2 Me gusta

En la barra lateral, me pregunto si es posible mostrar las subcategorías con una sangría debajo de su categoría principal. Ver en mi barra lateral:

Por ejemplo, debajo de “Eventos” tengo la subcategoría “AGU” sin sangría. Muchos usuarios no distinguen los colores y piensan que “AGU” es solo una categoría diferente, no relacionada con “Eventos”. Por lo tanto, más tarde, buscan “AGU” como una categoría y no como una subcategoría, y por eso no la encuentran fácilmente.

¿Hay alguna opción para tener esa sangría? Si no la hay, sería bueno tenerla.

Me pregunto si podríamos simplificar esto.

En el componente de tema Category Hider se agregó un interruptor para ocultar todas las subcategorías.

.hamburger-panel .category-link.subcategory {
      display:none;
}

Antes de este componente, había ocultado manualmente todas las subcategorías, apuntando a cada una individualmente. Hasta que alguien compartió un código de 1 línea que ocultaba todas las subcategorías.

li.sidebar-section-link-wrapper {
  .category-link.subcategory {
    margin-left: 1em;
  }
}

Probaré el código anterior en un momento.

Desafortunadamente, esto no funciona. :sad_but_relieved_face:. ¿Podría haber una manera de ajustar este código para que funcione?

Creé un componente de tema sencillo para hacer esto

10 Me gusta

¡Funciona muy bien! ¡Gracias!

1 me gusta