# Latest Dashboard 2.0 Release - Tabs, Number Input & New Gauges

**URL:** https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506
**Category:** Dashboard
**Tags:** dashboard-2
**Created:** [28 August 2024 13:12 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506 "2024-08-28T13:12:32Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [28 August 2024 13:12 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/1 "2024-08-28T13:12:32Z")

</div>

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/3/b3d0adc3e6a584f7d0e981a832a7a8deccc70eb5.png)

`1.15.0` went out yesterday and thought I'd share a [link to the article](https://flowfuse.com/blog/2024/08/dashboard-new-layout-widgets-and-gauges/) detailing some of the new features, including:

- New Layout: Tabs
- New Widget: Number Input (Numeric)
- Gauge Types: Battery Charge & Tank Level

---

<div class="post-metadata">

### Author: ![gerry](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gerry/32/21604_2.png) [@gerry](https://discourse.nodered.org/u/gerry)
#### Post date: [28 August 2024 14:26 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/2 "2024-08-28T14:26:50Z")

</div>

If you click here under what's new section link is dead

---

<div class="post-metadata">

### Author: ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)
#### Post date: [28 August 2024 14:56 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/3 "2024-08-28T14:56:40Z")

</div>

> [@gerry](#):
>
> what's new section link is dead

@gerry,  
I assume it needs to be [this](https://github.com/orgs/FlowFuse/projects/15/views/1) one.

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [28 August 2024 14:59 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/4 "2024-08-28T14:59:14Z")

</div>

Thanks for spotting - fix incoming - @BartButenaers is correct for the link

---

<div class="post-metadata">

### Author: ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)
#### Post date: [28 August 2024 19:11 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/5 "2024-08-28T19:11:38Z")

</div>

> [@joepavitt](#):
>
> `1.15.0` went out yesterday and thought I'd share a [link to the article](https://flowfuse.com/blog/2024/08/dashboard-new-layout-widgets-and-gauges/) detailing some of the new features, including:
> 
> - New Layout: Tabs

Where is the documentation for **Layout: Tabs**?  
I've looked through the [documentation](https://dashboard.flowfuse.com/getting-started.html), not read every line, but cannot see anything. Also looked through my dashboard settings, and nothing stands out.

Dashboard v1.15.0

---

<div class="post-metadata">

### Author: ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)
#### Post date: [28 August 2024 19:34 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/6 "2024-08-28T19:34:37Z")

</div>

It is funny that the example screenshot shows form elements as one would hope for

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/9/29c08ebc4270e819a2f8c89830b29f0e30546c4d.png)

But the reality is that the form elements have massive paddings that could fit 3 of those form inputs in the same space. All form elements are extremely inefficient for screenspace, especially for mobile.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/b/cb3c508cb1da61b59f074c7c9cff4f2fa59def7d.png)

note that the content is not center aligned.

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [28 August 2024 20:10 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/7 "2024-08-28T20:10:46Z")

</div>

![SmartSelect_20240828_211012_Chrome](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/7/974bdca558780b17dc76406a543a750282bf516e.jpeg)

> **[Layout: Tabs | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/layouts/types/tabs.html)**
>
> Discover the features and benefits of Node-RED Dashboard 2.0, designed to streamline and enhance your Node-RED experience.

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [28 August 2024 20:12 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/8 "2024-08-28T20:12:54Z")

</div>

Hmmm... that doesn't look right, what browser is that?

You can also now control that sizing by changing the "Row Height" option on your theme: [Config: UI Theme ui-theme | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/nodes/config/ui-theme.html#row-height)

---

<div class="post-metadata">

### Author: ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)
#### Post date: [28 August 2024 20:20 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/9 "2024-08-28T20:20:29Z")

</div>

Thanks Joe, I don't know how I missed that 🤔

---

<div class="post-metadata">

### Author: ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)
#### Post date: [28 August 2024 20:24 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/10 "2024-08-28T20:24:39Z")

</div>

It is a screenshot from the blog 🤪

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [28 August 2024 20:37 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/11 "2024-08-28T20:37:01Z")

</div>

Good point, well presented 😄

I didn't write the article and missed that in the review, but I'll double check the actual widget tomorrow

---

<div class="post-metadata">

### Author: ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)
#### Post date: [28 August 2024 20:38 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/12 "2024-08-28T20:38:31Z")

</div>

It presents OK in my dashboard @bakman2 although not as tight as the demo.

This is it displayed in a chrome browser - size 2 x 1  
Looks the same in both Firefox & Edge

![number](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/3/5356d1ef7b05d3cb64e6b6370e5cf0aac46f46f6.jpeg)

---

<div class="post-metadata">

### Author: ![KarolisL](https://avatars.discourse-cdn.com/v4/letter/k/a4c791/32.png) [@KarolisL](https://discourse.nodered.org/u/KarolisL)
#### Post date: [29 August 2024 05:45 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/13 "2024-08-29T05:45:33Z")

</div>

@joepavitt Does it have the latest vuetify 3.7?

> **[The Vuetify roadmap — Vuetify](https://vuetifyjs.com/en/introduction/roadmap/#section-2024-component-roadmap)**
>
> The upcoming planned features and new functionality coming to Vuetify. New components, new directives, and much much...

---

<div class="post-metadata">

### Author: ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)
#### Post date: [29 August 2024 05:59 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/14 "2024-08-29T05:59:34Z")

</div>

Thanks, the compact option looks much better (I would make this the default).

---

<div class="post-metadata">

### Author: ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)
#### Post date: [29 August 2024 06:00 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/15 "2024-08-29T06:00:13Z")

</div>

Not yet: [node-red-dashboard/package.json at da48915e3f58dbd67f42ff646d0c58fd3f5776ff · FlowFuse/node-red-dashboard · GitHub](https://github.com/FlowFuse/node-red-dashboard/blob/da48915e3f58dbd67f42ff646d0c58fd3f5776ff/package.json#L105)

Is there something in the 3.7 release in particular you are interested in?

---

<div class="post-metadata">

### Author: ![KarolisL](https://avatars.discourse-cdn.com/v4/letter/k/a4c791/32.png) [@KarolisL](https://discourse.nodered.org/u/KarolisL)
#### Post date: [29 August 2024 06:07 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/16 "2024-08-29T06:07:22Z")

</div>

Treeview had some icon's appending bug [[Bug Report][3.6.9] VTreeview: Append/Prepend Slots not usable on parent nodes when activatable · Issue #20009 · vuetifyjs/vuetify · GitHub](https://github.com/vuetifyjs/vuetify/issues/20009) which is resolved in this release, but I can easily wait since I have workarounds already done.

In the future I will check dependencies, thanks

---

<div class="post-metadata">

### Author: ![Tom1](https://avatars.discourse-cdn.com/v4/letter/t/b487fb/32.png) [@Tom1](https://discourse.nodered.org/u/Tom1)
#### Post date: [29 August 2024 07:26 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/17 "2024-08-29T07:26:31Z")

</div>

Hi, after updating to newest release of dashboard 2.0., buttons ( ui-button) on my existing projects that were sized 5x5 now look like 5x1 and no matter what size i choose only length changes... Any idea how to fix it?

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [29 August 2024 07:34 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/18 "2024-08-29T07:34:10Z")

</div>

Hi @Tom1 - which layout type and browser are you using? Are you able to share a screenshot please?

Update: Found the problem - fix incoming

---

<div class="post-metadata">

### Author: ![Xenon](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/xenon/32/48893_2.png) [@Xenon](https://discourse.nodered.org/u/Xenon)
#### Post date: [2 September 2024 12:25 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/19 "2024-09-02T12:25:51Z")

</div>

Hi, in the new "Input Number", there is an interesting feature to define the -\>range\<-, but seems not working. Is it supported?

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/9/d9fe1811aad9f172d766183098e54e8985f7f915.png)

Thanks,  
Giulio

---

<div class="post-metadata">

### Author: ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)
#### Post date: [2 September 2024 13:00 UTC](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506/20 "2024-09-02T13:00:16Z")

</div>

There is already an open issue for this I think. Have a look and if it covers your problem then add a note that you are seeing it too.

> <https://github.com/FlowFuse/node-red-dashboard/issues/1244>
>
> \### Current Behavior
> 
> I can put values in number input out of bounds of Range …( min - max) setting. 
> !\[image\](https://github.com/user-attachments/assets/93794be3-c142-493a-9b87-5964eb4e7fc2)
> 
> EDIT : Also number input widget does not show up in safari
> \### Expected Behavior
> 
> I expect it to limit input value if input is out of bounds. At least not output out of bounds value. 
> 
> \### Steps To Reproduce
> 
> \_No response\_
> 
> \### Environment
> 
> \- Dashboard version: 1.15.0
> \- Node-RED version: 4.0.2
> \- Node.js version: 20
> \- npm version:
> \- Platform/OS: RT linux arm32 
> \- Browser: Chrome
> 
> 
> \### Have you provided an initial effort estimate for this issue?
> 
> I have provided an initial effort estimate

[Next page](https://discourse.nodered.org/t/latest-dashboard-2-0-release-tabs-number-input-new-gauges/90506.md?page=2)
