Frontend: Accessibility in new Alarm Panel
HA Version: 0.88.0
Frontend Version: 20190220.0
Not a frontend developer here, the following is just an opinion.
The latest ui update of the alarm panel is less accessible on the default theme than the previous one.
The UI is cool and I enjoy it, but when you put it in the perspective of someone who has an hard time reading (eyes, ...), some problems may arise.
I came up with this solution:
Change the font of the numpad to something bigger and add an outline to the button.
What do you think?
eliseomartelli
All 26 comments
Agreed. Very challenging to see the buttons on tablets, or wall mounts.
mack0352
on 22 Feb 2019
Any movement on this?
A font size change would seem to be a small thing to include in the next update.
tomlut
on 22 Apr 2019
Yes font on alarm panel is too small. Before update was bigger and was OK.
Please fix this problem....
pepeEL
on 26 Apr 2019
Seems that the buttons are no longer buttons either. If you compare it to the documentation now it gives a totally different alarm panel. See for example https://community.home-assistant.io/t/lovelace-alarm-card/59831/185 (also first post shows the original version too)
riemers
on 12 Jun 2019
Thank you @iantrich 👍
keith721
on 13 Sep 2019
@thomasloven do you know what css var this would be? I couldn't get it. I'm also awful with shadowdom 😄 I remember seeing you do something with card mod I think.
iantrich
on 15 Sep 2019
alarm_panel ??
On Sat, Sep 14, 2019 at 18:39 Ian Richardson notifications@github.com
wrote:
@thomasloven https://github.com/thomasloven do you know what car this
would be? I couldn't get it. I'm also awful with shadowdom 😄 I remember
seeing you do something with card mod I think.—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/home-assistant/home-assistant-polymer/issues/2812?email_source=notifications&email_token=AGJKDIQGNYBBVYFCEHKPRDLQJVRYXA5CNFSM4GYZJ232YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD6XFMWY#issuecomment-531519067,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGJKDIWUSX3R3DDSZHJNGCTQJVRYXANCNFSM4GYZJ23Q
.>
Vegetarian is an ancient Native American word meaning "bad hunter".
keith721
on 15 Sep 2019
I have taken a look at this and may have a solution. Can I PR my solution?
mr-awk
on 11 Oct 2019
Absolutely
iantrich
on 11 Oct 2019
Please!
thomasloven
on 11 Oct 2019
This is how it looks
mr-awk
on 11 Oct 2019
I know the bottom left button looks wierd but it is there, just added border and border-color in the frontend.
mr-awk
on 11 Oct 2019
I will do a new PR. my git setup is doing strange things
mr-awk
on 11 Oct 2019
That font still looks mighty small.
tomlut
on 11 Oct 2019
@tomlut Yes, I having trouble with the font size. I will have a look at it.
That font still looks mighty small.
mr-awk
on 11 Oct 2019
I remember poking at the font awhile back and running into issues as well.
cc @thomasloven - "the shadowdom wizard"
iantrich
on 11 Oct 2019
#keypad mwc-button {
margin-bottom: 5%;
width: 30%;
padding: calc(var(--base-unit) / 3);
font-size: calc(var(--base-unit) / 3);
box-sizing: border-box;
}
I have tried a couple of different formulas with a change in the size of the font.
Search is still going on....
mr-awk
on 11 Oct 2019
Drop that --base-unit I don't think it does anything useful?
bramkragten
on 11 Oct 2019
--base-unit is set to 15px in the ha_card section is what I see.
mr-awk
on 11 Oct 2019
@bramkragten do you have any idea of why changing font size don't change the size? Thats the only thing left do complete this issue.
mr-awk
on 12 Oct 2019
There was a thread discussing this particular item a few weeks ago at the
community forum.
On Sat, Oct 12, 2019 at 10:27 Marcus Fredlund notifications@github.com
wrote:
@bramkragten https://github.com/bramkragten do you have any idea of why
changing font size don't change the size? Thats the only thing left do
complete this issue.—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/home-assistant/home-assistant-polymer/issues/2812?email_source=notifications&email_token=AGJKDIS2FQ2KWEY3WXF2FD3QOHNEXA5CNFSM4GYZJ232YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEBCASZQ#issuecomment-541329766,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AGJKDISINXTL4VG36IQTWBDQOHNEXANCNFSM4GYZJ23Q
.>
Vegetarian is an ancient Native American word meaning "bad hunter".
keith721
on 12 Oct 2019
There was a thread discussing this particular item a few weeks ago at the community forum.
On Sat, Oct 12, 2019 at 10:27 Marcus Fredlund @.*> wrote: @bramkragten https://github.com/bramkragten do you have any idea of why changing font size don't change the size? Thats the only thing left do complete this issue. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#2812?email_source=notifications&email_token=AGJKDIS2FQ2KWEY3WXF2FD3QOHNEXA5CNFSM4GYZJ232YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEBCASZQ#issuecomment-541329766>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGJKDISINXTL4VG36IQTWBDQOHNEXANCNFSM4GYZJ23Q .
-- Vegetarian is an ancient Native American word meaning "bad hunter".
@keith721 Do you remember where to find it? or what conclusion they came to??
mr-awk
on 12 Oct 2019
looking better but still searching for a solution of the font size.
mr-awk
on 12 Oct 2019
changing all the keypad buttons to standard button instead of mwc-button.
keith721
on 12 Oct 2019
May have found some way to get around the size bug in mwc-button.
mr-awk
on 13 Oct 2019
this is how it looks right now.
mr-awk
on 13 Oct 2019
Related issues
Depechie
·
3Comments
infestdead
·
3Comments
KennethLavrsen
·
3Comments
wangyt123ng
·
3Comments
Lopton
·
4Comments
Most helpful comment
this is how it looks right now.