Closed jusmop closed 1 month ago
I'm not sure how to style this. I've experimented with it too, without much luck. I'm using the same password code field as the standard HA password field:
if you figure out any improvement, please let me know!
Thanks for the links. Material Design Components? What are they? (rhetorical question - I'm well out of my depth here). I'll persevere for a bit... If I get anywhere I'll let you know.
There's some info here: https://design.home-assistant.io/#concepts/home may be able to ask on the ux dev discord.
I found a possible solution to the input text field font size:
Insert a new line before line 460: --mdc-typography-subtitle1-font-size: 24px;
I found the variable using the Chrome style inspector for a dashboard page with the custom alarm card on it. I have no idea if it has unwanted side effects (ideally it only applies to that card), but it changes the font size for me.
Good find! Thanks!
Rather than putting that in the ha-card section of the css, how about constraining it to be just in the ha-textfield section: https://github.com/jcooper-korg/AlarmPanel/blob/18a92d882c3eb9dab3fdb3869b46bced307821bb/alarm_control_panel-card.js#L572-L577
I tried adding it there, and it works! Thanks again
thanks again @jusmop - I added that change in ceeffdb
This is not a bug report - just a request for assistance.
I have customised the UI of this alarm panel more-or-less successfully but there is one change I'm struggling with. I'm trying to make the code input box text larger and also have the text "Code" be on the same line as the hidden password. I have made the box itself wider.
Adding a font-size value to the ha-textfield css string (around line 575) does not have any effect. Does anyone know how to enlarge the font?
Thanks for sharing the card, i've found it very useful - particularly the timer.