alarmdecoder.com

Feature:

When you detect you are on a mobile device. Have the Display.Keys scale to the screen size.

Currently the keys are very small on a 1080p resolution device. Anyone with large fingers will have difficulty hitting the buttons.

Is it possible to have the buttons auto scale to be as large as possible while maintaining the same design? The keypad could be much larger.

I attached a screenshot...

In the next update there are new responsive templates that should alleviate this issue. That being said, the project is fully open source, so feel free to contribute.

kevin wrote:In the next update there are new responsive templates that should alleviate this issue. That being said, the project is fully open source, so feel free to contribute.

Will do!

As a quick hack... this is def not a good overall solution.

Edited keypad.css changed it to the following...

Work

Code: Select all

.mobile .keypad-button {
    width: 150px !important;
    height: 150px;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    user-select: none !important;
    -ms-user-select: none !important;
}


All the templates have been reworked in the newest version that we are getting ready to push out

Those styles do not exist in the new version at all There is no differentiation between devices, it is responsive using the bootstrap3 library.

I can comfortably use the new templates on my Galaxy S7, ipad, and desktop.

Ok, great. I'll give it a try once it's released.

Hey Kevin, when do you plan to release the new version? The keypad is unfortunately quite unusable on an iPhone with the current keypad size

New version is released

How do I go about loading the update. My alarm decoder webapp is not showing that an update is available.

If there is no update notification you can go to https://alarmdecoder.local/update

The new version hasn't fixed the tiny buttons on mobile (iOS). In fact, the entire interface isn't very responsive at all, it's just really wide and all the text is tiny like before. What's worse, the new interface doesn't seem to use keypad.css at all, so the useful hack posted above is also broken. I tried creating a user_custom.css file for the keypad buttons to apply the above hack, but it only makes the keypad buttons longer, but doesn't change their width, and I end up with long thin buttons. I suppose it's better than short thin buttons for now.