Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve UI of admin site settings #4163

Merged
merged 1 commit into from
Jul 12, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 3 additions & 3 deletions app/controllers/admin/settings_controller.rb
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ class SettingsController < BaseController
).freeze

def edit
@settings = Setting.all_as_records
@admin_settings = Form::AdminSettings.new
end

def update
Expand All @@ -38,12 +38,12 @@ def update
private

def settings_params
params.permit(ADMIN_SETTINGS)
params.require(:form_admin_settings).permit(ADMIN_SETTINGS)
end

def value_for_update(key, value)
if BOOLEAN_SETTINGS.include?(key)
value == 'true'
value == '1'
else
value
end
Expand Down
87 changes: 63 additions & 24 deletions app/javascript/styles/forms.scss
Original file line number Diff line number Diff line change
Expand Up @@ -57,10 +57,7 @@ code {
}
}

.input.file,
.input.select,
.input.radio_buttons,
.input.check_boxes {
.input.with_label {
padding: 15px 0;
margin-bottom: 0;

Expand All @@ -71,6 +68,44 @@ code {
display: block;
padding-top: 5px;
}

&.boolean {
padding: initial;
margin-bottom: initial;

.label_input > label {
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
display: block;
width: auto;
}

label.checkbox {
position: relative;
padding-left: 25px;
flex: 1 1 auto;
}
}
}

.input.with_block_label {
& > label {
font-family: inherit;
font-size: 16px;
color: $primary-text-color;
display: block;
padding-top: 5px;
}

.hint {
margin-bottom: 15px;
}

li {
float: left;
width: 50%;
}
}

.fields-group {
Expand Down Expand Up @@ -106,7 +141,7 @@ code {
input[type=checkbox] {
position: absolute;
left: 0;
top: 1px;
top: 5px;
margin: 0;
}

Expand All @@ -116,6 +151,29 @@ code {
}
}

.check_boxes {
.checkbox {
label {
font-family: inherit;
font-size: 14px;
color: $primary-text-color;
display: block;
width: auto;
position: relative;
padding-top: 5px;
padding-left: 25px;
flex: 1 1 auto;
}

input[type=checkbox] {
position: absolute;
left: 0;
top: 5px;
margin: 0;
}
}
}

input[type=text],
input[type=number],
input[type=email],
Expand Down Expand Up @@ -390,25 +448,6 @@ code {
}
}

.user_filtered_languages {
& > label {
font-family: inherit;
font-size: 16px;
color: $primary-text-color;
display: block;
padding-top: 5px;
}

.hint {
margin-bottom: 15px;
}

li {
float: left;
width: 50%;
}
}

.post-follow-actions {
text-align: center;
color: $ui-primary-color;
Expand Down
29 changes: 29 additions & 0 deletions app/models/form/admin_settings.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
# frozen_string_literal: true

class Form::AdminSettings
include ActiveModel::Model

delegate(
:site_contact_username,
:site_contact_username=,
:site_contact_email,
:site_contact_email=,
:site_title,
:site_title=,
:site_description,
:site_description=,
:site_extended_description,
:site_extended_description=,
:site_terms,
:site_terms=,
:open_registrations,
:open_registrations=,
:closed_registrations_message,
:closed_registrations_message=,
:open_deletion,
:open_deletion=,
:timeline_preview,
:timeline_preview=,
to: Setting
)
end
88 changes: 28 additions & 60 deletions app/views/admin/settings/edit.html.haml
Original file line number Diff line number Diff line change
@@ -1,64 +1,32 @@
- content_for :page_title do
= t('admin.settings.title')

= form_tag(admin_settings_path, method: :put, class: 'simple_form', style: 'max-width: 100%') do
%table.table
%thead
%tr
%th{ width: '40%' }
= t('admin.settings.setting')
%th
%tbody
%tr
%td
%strong= t('admin.settings.contact_information.label')
%td= text_field_tag :site_contact_username, @settings['site_contact_username'].value, place_holder: t('admin.settings.contact_information.username')
%tr
%td
%strong= t('admin.accounts.email')
%td= text_field_tag :site_contact_email, @settings['site_contact_email'].value, place_holder: t('admin.settings.contact_information.email')
%tr
%td
%strong= t('admin.settings.site_title')
%td= text_field_tag :site_title, @settings['site_title'].value
%tr
%td
%strong= t('admin.settings.site_description.title')
%p= t('admin.settings.site_description.desc_html')
%td= text_area_tag :site_description, @settings['site_description'].value, rows: 8
%tr
%td
%strong= t('admin.settings.site_description_extended.title')
%p= t('admin.settings.site_description_extended.desc_html')
%td= text_area_tag :site_extended_description, @settings['site_extended_description'].value, rows: 8
%tr
%td
%strong= t('admin.settings.site_terms.title')
%p= t('admin.settings.site_terms.desc_html')
%td= text_area_tag :site_terms, @settings['site_terms'].value, rows: 8
%tr
%td
%strong= t('admin.settings.registrations.open.title')
%p= t('admin.settings.registrations.open.desc_html')
%td
= select_tag :open_registrations, options_for_select({ t('simple_form.no') => false, t('simple_form.yes') => true }, @settings['open_registrations'].value)
%tr
%td
%strong= t('admin.settings.registrations.closed_message.title')
%p= t('admin.settings.registrations.closed_message.desc_html')
%td= text_area_tag :closed_registrations_message, @settings['closed_registrations_message'].value, rows: 8
%tr
%td
%strong= t('admin.settings.registrations.deletion.title')
%p= t('admin.settings.registrations.deletion.desc_html')
%td
= select_tag :open_deletion, options_for_select({ t('simple_form.no') => false, t('simple_form.yes') => true }, @settings['open_deletion'].value)
%tr
%td
%strong= t('admin.settings.timeline_preview.title')
%p= t('admin.settings.timeline_preview.desc_html')
%td
= select_tag :timeline_preview, options_for_select({ t('simple_form.no') => false, t('simple_form.yes') => true }, @settings['timeline_preview'].value)
= simple_form_for @admin_settings, url: admin_settings_path, html: { method: :patch } do |f|
.fields-group
= f.input :site_title, placeholder: t('admin.settings.site_title')
= f.input :site_description, wrapper: :with_block_label, as: :text, label: t('admin.settings.site_description.title'), hint: t('admin.settings.site_description.desc_html'), input_html: { rows: 8 }
= f.input :site_contact_username, placeholder: t('admin.settings.contact_information.username')
= f.input :site_contact_email, placeholder: t('admin.settings.contact_information.email')

.simple_form.actions
= button_tag t('generic.save_changes'), type: :submit, class: :btn
%hr/

.fields-group
= f.input :timeline_preview, as: :boolean, wrapper: :with_label, label: t('admin.settings.timeline_preview.title'), hint: t('admin.settings.timeline_preview.desc_html')

.fields-group
= f.input :open_registrations, as: :boolean, wrapper: :with_label, label: t('admin.settings.registrations.open.title'), hint: t('admin.settings.registrations.open.desc_html')

.fields-group
= f.input :open_deletion, as: :boolean, wrapper: :with_label, label: t('admin.settings.registrations.deletion.title'), hint: t('admin.settings.registrations.deletion.desc_html')

.fields-group
= f.input :closed_registrations_message, as: :text, wrapper: :with_block_label, label: t('admin.settings.registrations.closed_message.title'), hint: t('admin.settings.registrations.closed_message.desc_html'), input_html: { rows: 8 }

%hr/

.fields-group
= f.input :site_extended_description, wrapper: :with_block_label, as: :text, label: t('admin.settings.site_description_extended.title'), hint: t('admin.settings.site_description_extended.desc_html'), input_html: { rows: 8 }
= f.input :site_terms, wrapper: :with_block_label, as: :text, label: t('admin.settings.site_terms.title'), hint: t('admin.settings.site_terms.desc_html'), input_html: { rows: 8 }

.actions
= f.button :button, t('generic.save_changes'), type: :submit
4 changes: 2 additions & 2 deletions config/initializers/simple_form.rb
Original file line number Diff line number Diff line change
Expand Up @@ -50,14 +50,14 @@
# b.use :full_error, wrap_with: { tag: :span, class: :error }
end

config.wrappers :with_label, class: :input, hint_class: :field_with_hint, error_class: :field_with_errors do |b|
config.wrappers :with_label, class: [:input, :with_label], hint_class: :field_with_hint, error_class: :field_with_errors do |b|
b.use :html5
b.use :label_input, wrap_with: { tag: :div, class: :label_input }
b.use :hint, wrap_with: { tag: :span, class: :hint }
b.use :error, wrap_with: { tag: :span, class: :error }
end

config.wrappers :with_block_label, class: :input, hint_class: :field_with_hint, error_class: :field_with_errors do |b|
config.wrappers :with_block_label, class: [:input, :with_block_label], hint_class: :field_with_hint, error_class: :field_with_errors do |b|
b.use :html5
b.use :label
b.use :hint, wrap_with: { tag: :span, class: :hint }
Expand Down
2 changes: 0 additions & 2 deletions config/locales/ca.yml
Original file line number Diff line number Diff line change
Expand Up @@ -155,15 +155,13 @@ ca:
settings:
contact_information:
email: Introduir una adreça de correu electrònic pùblica
label: Informació de contacte
username: Introduir un nom d'usuari
registrations:
closed_message:
desc_html: Apareix en la primera pàgina quan es tanquen els registres<br>Pot utilitzar etiquetes HTML
title: Missatge de registre tancat
open:
title: Registre obert
setting: Ajust
site_description:
desc_html: Es mostra com un paràgraf a la pàgina principal i s'utilitza com una etiqueta meta.<br>Pots utilitzar etiquetes HTML, en particular <code>&lt;a&gt;</code> i <code>&lt;em&gt;</code>.
title: Descripció del lloc
Expand Down
2 changes: 0 additions & 2 deletions config/locales/de.yml
Original file line number Diff line number Diff line change
Expand Up @@ -129,15 +129,13 @@ de:
settings:
contact_information:
email: Eine öffentliche E-Mail-Adresse angeben
label: Kontaktinformationen
username: Einen Benutzernamen angeben
registrations:
closed_message:
desc_html: Wird auf der Frontseite angezeigt, wenn die Registrierung geschlossen ist<br>Du kannst HTML-Tags benutzen
title: Nachricht über geschlossene Registrierung
open:
title: Offene Registrierung
setting: Einstellung
site_description:
desc_html: Wird als Absatz auf der Frontseite angezeigt und als Meta-Tag benutzt.<br>Du kannst HTML-Tags benutzen, insbesondere <code>&lt;a&gt;</code> und <code>&lt;em&gt;</code>.
title: Seitenbeschreibung
Expand Down
40 changes: 19 additions & 21 deletions config/locales/en.yml
Original file line number Diff line number Diff line change
Expand Up @@ -168,33 +168,31 @@ en:
view: View
settings:
contact_information:
email: Enter a public e-mail address
label: Contact information
username: Enter a username
email: Business e-mail
username: Contact username
registrations:
closed_message:
desc_html: Displayed on frontpage when registrations are closed<br>You can use HTML tags
desc_html: Displayed on frontpage when registrations are closed. You can use HTML tags
title: Closed registration message
deletion:
desc_html: Allow anyone to delete their account
title: Open account deletion
open:
desc_html: Allow anyone to create an account
title: Open registration
deletion:
desc_html: Allow anyone to delete their account
title: Open deletion
timeline_preview:
desc_html: Display public timeline on landing page
title: Timeline preview
setting: Setting
site_description:
desc_html: Displayed as a paragraph on the frontpage and used as a meta tag.<br>You can use HTML tags, in particular <code>&lt;a&gt;</code> and <code>&lt;em&gt;</code>.
title: Site description
desc_html: Introductory paragraph on the frontpage and in meta tags. You can use HTML tags, in particular <code>&lt;a&gt;</code> and <code>&lt;em&gt;</code>.
title: Instance description
site_description_extended:
desc_html: Displayed on extended information page<br>You can use HTML tags
title: Extended site description
desc_html: A good place for your code of conduct, rules, guidelines and other things that set your instance apart. You can use HTML tags
title: Custom extended information
site_terms:
desc_html: Displayed on terms page<br>You can use HTML tags
title: Privacy policy
site_title: Site title
desc_html: You can write your own privacy policy, terms of service or other legalese. You can use HTML tags
title: Custom terms of service
site_title: Instance name
timeline_preview:
desc_html: Display public timeline on landing page
title: Timeline preview
title: Site Settings
subscriptions:
callback_url: Callback URL
Expand Down Expand Up @@ -230,12 +228,12 @@ en:
authorize_follow:
error: Unfortunately, there was an error looking up the remote account
follow: Follow
following: 'Success! You are now following:'
follow_request: 'You have sent a follow request to:'
following: 'Success! You are now following:'
post_follow:
web: Go to web
return: Return to the user's profile
close: Or, you can just close this window.
return: Return to the user's profile
web: Go to web
prompt_html: 'You (<strong>%{self}</strong>) have requested to follow:'
title: Follow %{acct}
datetime:
Expand Down
2 changes: 0 additions & 2 deletions config/locales/fa.yml
Original file line number Diff line number Diff line change
Expand Up @@ -141,15 +141,13 @@ fa:
settings:
contact_information:
email: یک نشانی ایمیل عمومی وارد کنید
label: اطلاعات تماس
username: یک نام کاربری وارد کنید
registrations:
closed_message:
desc_html: وقتی امکان ثبت نام روی سرور فعال نباشد در صفحهٔ اصلی نمایش می‌یابد<br>می‌توانید HTML بنویسید
title: پیغام برای فعال‌نبودن ثبت نام
open:
title: امکان ثبت نام
setting: تنظیمات
site_description:
desc_html: روی صفحهٔ اصلی نمایش می‌یابد و همچنین به عنوان تگ‌های HTML.<br>می‌توانید HTML بنویسید, به‌ویژه <code>&lt;a&gt;</code> و <code>&lt;em&gt;</code>.
title: دربارهٔ سایت
Expand Down