如何使Foundry Slate容器可折叠？

Question

我想做一个Slate仪表板，它有我在其他地方见过的可折叠容器，但我不知道要应用哪种CSS样式。

有没有人能帮我理解如何做到这一点？

Answer 1

基本策略是将容器的高度设置为0px，并在其父容器具有某个类时将其溢出设置为隐藏。换句话说，向父容器中添加一个条件类，比如{{#if w_toggle.on}}hide-me{{/if}}，然后添加如下所示的

.hide-me {  
  #widget-w_child_container {    
    height: 0px !important;     
    overflow: hidden;   
  }
}

有关更高级的样式和布局技术，请在文档中找到Slate Development Best Practices指南的UX/UI注意事项部分。