Vuejs + electron + raspberry pi and 7" screen

Hi guys.
Im working on a controller screen based on vuejs with electron-builder running on a raspberry pi.
Project is ok but there is still some work to do with the visual.
Since I never set my screen size , my layout is not rendering as I would like.
So question is …
What is the proper way when working with a little 7" screen ?
Any recomendation / good practice / example … etc would be great.

btw ; it is not probably to move this project to a bigger screen.
Regards.
Leandro.

1.what UI library are u use?if u use UI library,you could find whether it has media query。
2.are u develop on [raspberry pi] ? OR when you develop on your work pc,you preview the result On the Screen which connect [raspberry pi]

————————————————————

Since I never develop on [raspberry pi],but I will follow bellow:
A.develop on the target platform

B:if i know the target screen info,i will open Chrome F12 and monitor the target Screen info to develop (if possible,create a demo to valid if this way is In line with expectations)

C.if the point above is impossible,i will develop on [work pc],and preview on the target platform(raspberry pi etc)

plus:there are some render diff between diffrent browsers.maybe it’s caused by Browser diff;

Hello @zc1789284658.
Im using vuetify.
Currently im developing at my pc and then I clone in the rb (it is very slow working on rb).
Can you explain point B and C ?
About screen info , I only know it is 7" …
Regards.

POINT B:
1.open chrome F12 on [raspberry pi ],console.log the device innerWidth and innerHeight


2.open chrome F12 on your work pc,adjust chrome to width/height as above

POINT C:

2 Likes

@zc1789284658 Are you an angel ?
What a nice info you gave me …
Both ideas are very nice , I will try them.
Thanks.

hope it’s useful:smiley: