Optimize user setting page for mobile browser (#1924)

* Remove overflow because it blocks scrolling on mobile safari.

* Add “-webkit-overflow-scrolling: touch;” to enable smooth scroll on mobile safari and other webkit browsers.

* Use radio buttons in user setting page.

Because select tags with long text are not fit in the width of mobile devices.

* Add flex property to fit labels to devise width.

* Change font size of select.

It causes auto zooming on mobile safari.
This commit is contained in:
Yuki Nakagawa
2017-04-17 17:37:00 +09:00
committed by Eugen
parent a67909ec1e
commit 548ff54714
4 changed files with 20 additions and 4 deletions

View File

@ -7,7 +7,7 @@
.fields-group
= f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }
= f.input :setting_default_privacy, collection: Status.visibilities.keys - ['direct'], wrapper: :with_label, include_blank: false, label_method: lambda { |visibility| I18n.t("statuses.visibilities.#{visibility}") }, required: false
= f.input :setting_default_privacy, collection: Status.visibilities.keys - ['direct'], wrapper: :with_label, include_blank: false, label_method: lambda { |visibility| I18n.t("statuses.visibilities.#{visibility}") }, required: false, as: :radio_buttons, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li'
.fields-group
= f.simple_fields_for :notification_emails, hash_to_object(current_user.settings.notification_emails) do |ff|