smhgit commented 4 years ago

Is it possible to add some scaling capabilities? Currently the remote is bigger than the size of the phone and it will be great if some scaling can be done or there will be smaller version available.

Great work BTW!!!

smhgit commented 4 years ago

This is what I see on my screen:

madmicio commented 4 years ago

have you set the color in your theme?

for the scaling problem maybe fix in next release

tigroz commented 4 years ago

hi, i've the same problem, i've set the color in my scheme but ... pad it's possible to edit the "netflix/prime video/D+/Dazn "section?

madmicio commented 4 years ago

in this card there are many options to insert, obviously changing the card everything is possible, distributing one that offers all the possible options is more difficult. I hope someone will help me to develop it soon

tigroz commented 4 years ago

and what about the button color? i can't change , i've added

button

active-background-button-color: "#f2f0fa" to my theme file but it didn't changed, this is my dark theme, i've added to the end:

dark:

Main colors

primary-color: '#5294E2' # Header accent-color: '#E45E65' # Accent color dark-primary-color: 'var(--accent-color)' # Hyperlinks light-primary-color: 'var(--accent-color)' # Horizontal line in about

Text colors

primary-text-color: '#FFFFFF' # Primary text colour, here is referencing dark-primary-color text-primary-color: 'var(--primary-text-color)' # Primary text colour secondary-text-color: '#5294E2' # For secondary titles in more info boxes etc. disabled-text-color: '#7F848E' # Disabled text colour label-badge-border-color: 'green' # Label badge border, just a reference value

Background colors

primary-background-color: '#383C45' # Settings background secondary-background-color: '#383C45' # Main card UI background divider-color: 'rgba(0, 0, 0, .12)' # Divider

Table rows

table-row-background-color: '#353840' # Table row table-row-alternative-background-color: '#3E424B' # Table row alternative

Nav Menu

paper-listbox-color: '#5294E2' # Navigation menu selection hoover paper-listbox-background-color: '#2E333A' # Navigation menu background paper-grey-50: 'var(--primary-text-color)' paper-grey-200: '#414A59' # Navigation menu selection

Paper card

paper-card-header-color: 'var(--accent-color)' # Card header text colour paper-card-background-color: '#434954' # Card background colour card-background-color: "var(--paper-card-background-color)" paper-dialog-background-color: '#434954' # Card dialog background colour paper-item-icon-color: 'var(--primary-text-color)' # Icon color paper-item-icon-active-color: '#F9C536' # Icon color active paper-item-icon_-color: 'green' paper-item-selected-_background-color: '#434954' # Popup item select paper-tabs-selection-bar-color: 'green'

Labels

label-badge-red: 'var(--accent-color)' # References the brand colour label badge border label-badge-text-color: 'var(--primary-text-color)' # Now same as label badge border but that's a matter of taste label-badge-background-color: '#2E333A' # Same, but can also be set to transparent here

Switches

paper-toggle-button-checked-button-color: 'var(--accent-color)' paper-toggle-button-checked-bar-color: 'var(--accent-color)' paper-toggle-button-checked-ink-color: 'var(--accent-color)' paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)' paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)' paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'

Sliders

paper-slider-knob-color: 'var(--accent-color)' paper-slider-knob-start-color: 'var(--accent-color)' paper-slider-pin-color: 'var(--accent-color)' paper-slider-active-color: 'var(--accent-color)' paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat' paper-slider-secondary-color: 'var(--secondary-background-color)' paper-slider-disabled-active-color: 'var(--disabled-text-color)' paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'

Google colors

google-red-500: '#E45E65' google-green-500: '#39E949'

button

active-background-button-color: "#333336"

madmicio commented 4 years ago

and what about the button color? i can't change , i've added

button

active-background-button-color: "#f2f0fa" to my theme file but it didn't changed, this is my dark theme, i've added to the end:

dark:

Main colors

primary-color: '#5294E2' # Header accent-color: '#E45E65' # Accent color dark-primary-color: 'var(--accent-color)' # Hyperlinks light-primary-color: 'var(--accent-color)' # Horizontal line in about

Text colors

primary-text-color: '#FFFFFF' # Primary text colour, here is referencing dark-primary-color text-primary-color: 'var(--primary-text-color)' # Primary text colour secondary-text-color: '#5294E2' # For secondary titles in more info boxes etc. disabled-text-color: '#7F848E' # Disabled text colour label-badge-border-color: 'green' # Label badge border, just a reference value

Background colors

primary-background-color: '#383C45' # Settings background secondary-background-color: '#383C45' # Main card UI background divider-color: 'rgba(0, 0, 0, .12)' # Divider

Table rows

table-row-background-color: '#353840' # Table row table-row-alternative-background-color: '#3E424B' # Table row alternative

Nav Menu

paper-listbox-color: '#5294E2' # Navigation menu selection hoover paper-listbox-background-color: '#2E333A' # Navigation menu background paper-grey-50: 'var(--primary-text-color)' paper-grey-200: '#414A59' # Navigation menu selection

Paper card

paper-card-header-color: 'var(--accent-color)' # Card header text colour paper-card-background-color: '#434954' # Card background colour card-background-color: "var(--paper-card-background-color)" paper-dialog-background-color: '#434954' # Card dialog background colour paper-item-icon-color: 'var(--primary-text-color)' # Icon color paper-item-icon-active-color: '#F9C536' # Icon color active paper-item-icon_-color: 'green' paper-item-selected-_background-color: '#434954' # Popup item select paper-tabs-selection-bar-color: 'green'

Labels

label-badge-red: 'var(--accent-color)' # References the brand colour label badge border label-badge-text-color: 'var(--primary-text-color)' # Now same as label badge border but that's a matter of taste label-badge-background-color: '#2E333A' # Same, but can also be set to transparent here

Switches

paper-toggle-button-checked-button-color: 'var(--accent-color)' paper-toggle-button-checked-bar-color: 'var(--accent-color)' paper-toggle-button-checked-ink-color: 'var(--accent-color)' paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)' paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)' paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'

Sliders

paper-slider-knob-color: 'var(--accent-color)' paper-slider-knob-start-color: 'var(--accent-color)' paper-slider-pin-color: 'var(--accent-color)' paper-slider-active-color: 'var(--accent-color)' paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat' paper-slider-secondary-color: 'var(--secondary-background-color)' paper-slider-disabled-active-color: 'var(--disabled-text-color)' paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'

Google colors

google-red-500: '#E45E65' google-green-500: '#39E949'

button

active-background-button-color: "#333336"

deactive no active deactive-background-button-color:

tigroz commented 4 years ago

ok now it's ok! deactive-background-button-color: PS: on the guide is written:

NOTE: need in "your-theme.yaml

button

active-background-button-color: "#f2f0fa"

madmicio commented 4 years ago

thank you very much.... now is ok!

tigroz commented 4 years ago

grazie a te... ottimo lavoro 👍

smhgit commented 4 years ago

Scale is working, almost :-) Gap between buttons and top bar increases when down scaling, see below 0.5

PiotrMachowski commented 4 years ago

Well, it's still a work in progress, it should be improved soon :)

smhgit commented 4 years ago

In addition to scaling, I suggest also the following:

Instead of the main control button, create minimalist approach which will replace it by one row of buttons. It will not have the same look as the remote itself but will enable to reduce the size - so maybe scaling will not be needed.
Give the option to hide buttons

The reason is that I would use the remote only on my phone, and it is very important that the size of the remote will fit screen without scrolling.

PiotrMachowski commented 4 years ago

Scaling has been completely rewritten, current version should satisfy your needs

eyalcha commented 4 years ago

@PiotrMachowski Thx, yes scaling is working.See below. I used 0.67 for scaling. There are buttons which I will probably not use, such as the play stop ff fb. Do you want me to open a new feature request to have the option to hide buttons or do you want to continue on this thread?

Thx

PiotrMachowski commented 4 years ago

Let's do it in a separate feature request. It might not be so simple

madmicio / LG-WebOS-Remote-Control

Feature request: scale down #1

button

Main colors

Text colors

Background colors

Table rows

Nav Menu

Paper card

Labels

Switches

Sliders

Google colors

button

button

Main colors

Text colors

Background colors

Table rows

Nav Menu

Paper card

Labels

Switches

Sliders

Google colors

button

button