[Question] On the homepage, can a div be removed when there is no related app available? When it's empty, display a div similar to "Click to add a monitor".
Question
首页是否可以在未存在相关APP时,移除div。当全空时展示一个类似“点击添加一个监控”的div On the homepage, can a div be removed when there is no related app available? When it's empty, display a div similar to "Click to add a monitor".
目前我仅有操作系统monitor,但是首页却在轮询滚动其他,感觉不直观 Currently, I only have the operating system monitor, but the homepage is polling and scrolling others, which feels non-intuitive.
seem good idea. But when there has no monitors eg: new user in system, how to display here? The "Click to add a monitor" seem not pretty
solution: 1.conditional display logic
- Remove empty category sections entirely when no monitors exist for that type.
- Show a unified "empty state" UI when no monitors exist at all (for new users).
2.Empty State Design
<div class="empty-monitor-state">
<img src="" alt="Add monitor">
<h3>No monitors configured yet</h3>
<button class="primary-button" @click="goToAddMonitor">
+ Add Your First Monitor
</button>
</div>
3.Visual Treatment
- Centered layout with friendly illustration
- Primary action button (60-80px larger than regular buttons)
- Subtle animation on hover
solution: 1.conditional display logic
- Remove empty category sections entirely when no monitors exist for that type.
- Show a unified "empty state" UI when no monitors exist at all (for new users).
2.Empty State Design
<div class="empty-monitor-state"> <img src="" alt="Add monitor"> <h3>No monitors configured yet</h3> <button class="primary-button" @click="goToAddMonitor"> + Add Your First Monitor </button> </div>3.Visual Treatment
- Centered layout with friendly illustration
- Primary action button (60-80px larger than regular buttons)
- Subtle animation on hover
I agree