How are you testing this? As long as the device object is getting the correct information then you should should see the responsive change and be able to adjust the value.
I would recommend using em as a unit instead of vw. That will already be a little more responsive to small screens.
Viewing it on your cell phone should properly show the changes in the height setting, but just in case there is something strange going on, I would recommend testing the device object. Set the label text in the footer to something like:
text: =device.desktop.toString()
And make sure that it says true on the notebook and false on the cell phone.
Device object is working correctly, because I can also see influence if I will increase a value (depends on if it’s for desktop or cell phone).
But decreasing has a lower limit which on the cell phone is still too wide. On the desktop it’s ok.
Ah, now I understand. Yes, the footer has a minimum height that is set by the f7 variable --f7-card-footer-min-height.
If you cannot reduce the footer beyond a certain height then you are running up against that limit and you will also have to change that value. Rather than work out something different, you should be able to just use the same expression you are using for height or you can just set it to something you know wil always be smaller than your height value such as 1px.
That value is there for a reason, so if you lower it and then reduce your footer height too far, you will likely wind up with some strange visual results that will also require further style fixes.