Adapt webUI to Touchscreen

Help and Support Help
1

Hi all,

I’m running volumio 1.5 with x-server and a 7’’ touchsreen. I did it like described in this http://volumio.org/forum/volumio-touch-screen-t2035.html.
Everything is working well!! Thanks to the gyus who make this happen!

My touchscreen has a 1280×800 pixel resolution. Because of this, I’m thinking about to make the buttons in the webUI a bit larger.
This would help to operate my system.
My question is: Is that possible? And if yes, how can it be realized?

Thanks in advance for your help
Stefan

2

HI Schmidie,
It’s very easy if you know a bit of CSS, you can connect to the RasPI with a sFTP client (ie FileZilla) using volumio.local has host, pi as user and raspberry as password.
The webUI content is in the /var/www folder, and the CSS to update is css/panels.css.
Wihch model is you 7’’ touchsreen ? Is it a capacitive or resistive model ?
Best
Julien

3

Hi Julien,

thank you for this hint. I have some (absolutely beginner) skills with HTML and CSS. I’ll try my very best :wink: .

The touchscreen I’m useing is the following: http://www.chalk-elec.com/?page_id=1280#!/7-black-frame-universal-HDMI-LCD-with-capacitive-multi-touch/p/21750201/category=3094861.
It is an capacitive touchscreen.

Regadrs
Stefan

4

Hi Julien,

I tried some things in panels.css and I enlarged the the top and bottom border, the songinformation and the countdown circle so far.
But I can’t find the right position to enlage the playback buttons and the volume circle.
Can you help me to find the right line in this file? If additional information to help are required, please let me know.

Regadrs
Stefan

5

Hi all,

I hope all of you had good start intio the new year. Now I have time again to work on the webui.
Finally I stuck with the size of the volume control. I can’t get it larger.
Find attached a screenshot of the actual situation.
Does anyone know whrer I can change the size?

Regards
Stefan
screenshot.png