diff --git a/app/controllers/user_controller.rb b/app/controllers/user_controller.rb
index fdf57126..dce041eb 100644
--- a/app/controllers/user_controller.rb
+++ b/app/controllers/user_controller.rb
@@ -156,14 +156,14 @@ class UserController < ApplicationController
current_user.theme.user_id = current_user.id
if current_user.theme.save
- flash[:success] = 'Theme saved.'
+ flash[:success] = t(".success")
else
- flash[:error] = 'Theme saving failed. ' + current_user.theme.errors.messages.flatten.join(' ')
+ flash[:error] = t(".error", errors: current_user.theme.errors.messages.flatten.join(" "))
end
elsif current_user.theme.update(update_attributes)
- flash[:success] = 'Theme saved.'
+ flash[:success] = t(".success")
else
- flash[:error] = 'Theme saving failed. ' + current_user.theme.errors.messages.flatten.join(' ')
+ flash[:error] = t(".error", errors: current_user.theme.errors.messages.flatten.join(" "))
end
redirect_to edit_user_theme_path
end
diff --git a/app/views/settings/_account.haml b/app/views/settings/_account.haml
index 22152fb0..dc5bfa11 100644
--- a/app/views/settings/_account.haml
+++ b/app/views/settings/_account.haml
@@ -19,6 +19,6 @@
%hr/
%p
= t(".delete.heading")
- = button_to t(".delete.action"), "/settings/account", data: { confirm: t(".delete.confirm") }, method: :delete, class: "btn btn-danger btn-xs"
+ = button_to t(".delete.action"), "/settings/account", data: { confirm: t("voc.confirm") }, method: :delete, class: "btn btn-danger btn-xs"
.visible-xs= render "shared/links"
diff --git a/app/views/settings/_theme.haml b/app/views/settings/_theme.haml
index 50ea4918..c5cb27f6 100644
--- a/app/views/settings/_theme.haml
+++ b/app/views/settings/_theme.haml
@@ -1,135 +1,105 @@
.card
.card-body
- %h1 Theming
- %p.lead Welcome to the Theme Editor!
- %p
- Here you'll be able to modify your Retrospring experience by adjusting all available colors.
- To further help you with adjusting needs, there are a few example elements using the specified colors, and sections will include
- descriptions on their general use on the site!
-
- %p
- And with that:
- %b Happy Theming!
+ %h1= t(".heading")
+ %p.lead= t(".lead")
+ = t(".body_html")
- if current_user.theme
.pull-right
- = button_to 'Delete Theme', delete_user_theme_path, data: { confirm: 'Are you sure?' }, tabindex: -1, method: :delete, class: 'btn btn-danger'
-= bootstrap_form_for(current_user.theme || Theme.new, url: { action: 'update_theme' }, html: { id: 'update_theme' }, method: :patch) do |f|
+ = button_to t(".delete"), delete_user_theme_path, data: { confirm: t("voc.confirm") }, tabindex: -1, method: :delete, class: "btn btn-danger"
+= bootstrap_form_for(current_user.theme || Theme.new, url: { action: "update_theme" }, html: { id: "update_theme" }, method: :patch) do |f|
.card
.card-body
- %h2 General
- %p
- Here you'll find general page values that are basically visible all across the page.
- .row
- .col-sm-6
- = f.text_field :background_color, class: 'color', data: { default: 0xF0EDF4 }
- .col-sm-6
- = f.text_field :body_text, class: 'color', data: { default: 0x000000 }
- .card
- .card-body
- %h2 Colors
- %p
- Colors you can find used on the site. The names of the colors usually describe the context.
- The "text" colors for all styles represent the color that text on top of these colors has.
+ %h2= t(".general.heading")
+ %p= t(".general.body")
- %ul
- %li
- %b Primary:
- The primary/brand color of the site, used for navigation, links, etc.
- %li
- %b Danger:
- Color used for errors or critical actions like deleting something.
- %li
- %b Warning:
- Color used for warnings if something non-critical has happened.
- %li
- %b Info:
- Color used for informational popups or messages.
- %li
- %b Success:
- Color used for messages if something went through successfully.
.row
.col-sm-6
- = f.text_field :primary_color, class: 'color', data: { default: 0x5E35B1 }
+ = f.text_field :background_color, class: "color", data: { default: 0xF0EDF4 }
.col-sm-6
- = f.text_field :primary_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- .alert.alert-primary
- A simple primary alert—check it out!
- .row
- .col-sm-6
- = f.text_field :danger_color, class: 'color', data: { default: 0xDC3545 }
- .col-sm-6
- = f.text_field :danger_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- .alert.alert-danger
- A simple danger alert—check it out!
- .row
- .col-sm-6
- = f.text_field :warning_color, class: 'color', data: { default: 0xFFC107 }
- .col-sm-6
- = f.text_field :warning_text, class: 'color', data: { default: 0x292929 }
- .col-sm-12
- .alert.alert-warning
- A simple warning alert—check it out!
- .row
- .col-sm-6
- = f.text_field :info_color, class: 'color', data: { default: 0x17A2B8 }
- .col-sm-6
- = f.text_field :info_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- .alert.alert-info
- A simple info alert—check it out!
- .row
- .col-sm-6
- = f.text_field :success_color, class: 'color', data: { default: 0x28A745 }
- .col-sm-6
- = f.text_field :success_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- .alert.alert-success
- A simple success alert—check it out!
- .row
- .col-sm-6
- = f.text_field :dark_color, class: 'color', data: { default: 0x343A40 }
- .col-sm-6
- = f.text_field :dark_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- %a.btn.btn-dark.mb-3{ href: '#' } A dark button
- .row
- .col-sm-6
- = f.text_field :light_color, class: 'color', data: { default: 0xF8F9FA }
- .col-sm-6
- = f.text_field :light_text, class: 'color', data: { default: 0xFFFFFF }
- .col-sm-12
- %a.btn.btn-light.mb-3{ href: '#' } A light button
- .row
- .col-sm-6
- = f.text_field :muted_text, class: 'color', data: { default: 0x6C757D }
- .col-sm-6
- %p.pt-4.text-muted Some muted text
+ = f.text_field :body_text, class: "color", data: { default: 0x000000 }
.card
.card-body
- %h2 Forms and Inputs
- %p
- Styles for form inputs, like textfields.
+ %h2= t(".colors.heading")
+ %p= t(".colors.body")
+
.row
.col-sm-6
- = f.text_field :input_color, class: 'color', data: { default: 0xFFFFFF }
+ = f.text_field :primary_color, class: "color", data: { default: 0x5E35B1 }
.col-sm-6
- = f.text_field :input_text, class: 'color', data: { default: 0x000000 }
+ = f.text_field :primary_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ .alert.alert-primary= t(".colors.alert.example", type: t(".colors.alert.type.primary"))
+ .row
+ .col-sm-6
+ = f.text_field :danger_color, class: "color", data: { default: 0xDC3545 }
+ .col-sm-6
+ = f.text_field :danger_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ .alert.alert-danger= t(".colors.alert.example", type: t(".colors.alert.type.danger"))
+ .row
+ .col-sm-6
+ = f.text_field :warning_color, class: "color", data: { default: 0xFFC107 }
+ .col-sm-6
+ = f.text_field :warning_text, class: "color", data: { default: 0x292929 }
+ .col-sm-12
+ .alert.alert-warning= t(".colors.alert.example", type: t(".colors.alert.type.warning"))
+ .row
+ .col-sm-6
+ = f.text_field :info_color, class: "color", data: { default: 0x17A2B8 }
+ .col-sm-6
+ = f.text_field :info_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ .alert.alert-info= t(".colors.alert.example", type: t(".colors.alert.type.info"))
+ .row
+ .col-sm-6
+ = f.text_field :success_color, class: "color", data: { default: 0x28A745 }
+ .col-sm-6
+ = f.text_field :success_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ .alert.alert-success= t(".colors.alert.example", type: t(".colors.alert.type.success"))
+ .row
+ .col-sm-6
+ = f.text_field :dark_color, class: "color", data: { default: 0x343A40 }
+ .col-sm-6
+ = f.text_field :dark_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ %a.btn.btn-dark.mb-3{ href: "#" }= t(".colors.button.example", type: t(".colors.button.type.dark"))
+ .row
+ .col-sm-6
+ = f.text_field :light_color, class: "color", data: { default: 0xF8F9FA }
+ .col-sm-6
+ = f.text_field :light_text, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-12
+ %a.btn.btn-light.mb-3{ href: "#" }= t(".colors.button.example", type: t(".colors.button.type.light"))
+ .row
+ .col-sm-6
+ = f.text_field :muted_text, class: "color", data: { default: 0x6C757D }
+ .col-sm-6
+ %p.pt-4.text-muted= t(".colors.text.example")
.card
.card-body
- %h2 Raised Content
- %p
- Raised content basically describes all the different boxes and panels you can see across the site.
+ %h2= t(".forms.heading")
+ %p= t(".forms.body")
+
.row
.col-sm-6
- = f.text_field :raised_background, class: 'color', data: { default: 0xFFFFFF }
+ = f.text_field :input_color, class: "color", data: { default: 0xFFFFFF }
.col-sm-6
- = f.text_field :raised_accent, class: 'color', data: { default: 0xF7F7F7 }
+ = f.text_field :input_text, class: "color", data: { default: 0x000000 }
+ .card
+ .card-body
+ %h2= t(".raised.heading")
+ %p= t(".raised.body")
+
+ .row
+ .col-sm-6
+ = f.text_field :raised_background, class: "color", data: { default: 0xFFFFFF }
+ .col-sm-6
+ = f.text_field :raised_accent, class: "color", data: { default: 0xF7F7F7 }
.card-footer
- %p Some text on top of a accented area on a raised element!
+ %p= t(".raised.accent.example")
.card
.card-body
.pull-left
- = f.submit t('views.actions.save'), class: 'btn btn-primary'
+ = f.primary
diff --git a/app/views/user/edit_theme.haml b/app/views/user/edit_theme.haml
index e4060ce2..6dd17ba8 100644
--- a/app/views/user/edit_theme.haml
+++ b/app/views/user/edit_theme.haml
@@ -1,4 +1,4 @@
-= render 'settings/theme'
+= render "settings/theme"
-- provide(:title, generate_title('Theme Settings'))
-- parent_layout 'user/settings'
+- provide(:title, generate_title(t(".title")))
+- parent_layout "user/settings"
diff --git a/config/locales/activerecord.en.yml b/config/locales/activerecord.en.yml
index b9b5f82b..e5468101 100644
--- a/config/locales/activerecord.en.yml
+++ b/config/locales/activerecord.en.yml
@@ -19,6 +19,28 @@ en:
website: "Website"
service:
post_tag: "Tag"
+ theme:
+ background_color: "Background color"
+ body_text: "Body text color"
+ dark_color: "Dark color"
+ dark_text: "Dark text color"
+ danger_color: "Danger color"
+ danger_text: "Danger text color"
+ info_color: "Info color"
+ info_text: "Info text color"
+ input_color: "Input color"
+ input_text: "Input text color"
+ light_color: "Light color"
+ light_text: "Light text color"
+ muted_text: "Muted text color"
+ primary_color: "Primary color"
+ primary_text: "Primary text color"
+ raised_accent: "Raised accent color"
+ raised_background: "Raised background color"
+ success_color: "Success color"
+ success_text: "Success text color"
+ warning_color: "Warning color"
+ warning_text: "Warning text color"
user:
current_password: "Current password"
email: "Email"
@@ -37,6 +59,12 @@ en:
motivation_header: "Shown in the header of the question box on your profile. Motivate users to ask you questions!"
services/twitter:
post_tag: "Automatically append a tag to your shared answers. A # symbol is not automatically prepended."
+ theme:
+ danger_color: "Color used for errors or critical actions like deleting something."
+ info_color: "Color used for informational popups or messages."
+ primary_color: "The primary/brand color of the site, used for navigation, links, etc."
+ success_color: "Color used for messages if something went through successfully."
+ warning_color: "Color used for warnings if something non-critical has happened."
helpers:
submit:
user:
@@ -45,3 +73,6 @@ en:
update: :voc.save
profile:
update: :voc.save
+ theme:
+ create: :voc.save
+ update: :voc.save
diff --git a/config/locales/controllers.en.yml b/config/locales/controllers.en.yml
index 85bc7a78..751ccf35 100644
--- a/config/locales/controllers.en.yml
+++ b/config/locales/controllers.en.yml
@@ -36,3 +36,6 @@ en:
update_profile:
success: :user.update.success
error: :user.update.error
+ update_theme:
+ success: "Theme saved successfully."
+ error: "Theme saving failed. %{errors}"
diff --git a/config/locales/views.en.yml b/config/locales/views.en.yml
index 2e7d031d..dafa5c11 100644
--- a/config/locales/views.en.yml
+++ b/config/locales/views.en.yml
@@ -38,7 +38,6 @@ en:
password: "Leave this blank if you don't want to change it"
delete:
action: "Delete my account"
- confirm: "Are you sure?"
heading: "Unsatisfied?"
export:
heading: "Export your data"
@@ -64,8 +63,50 @@ en:
connect: "Connect to %{service}"
disconnect: "Disconnect"
confirm: "Really disconnect service %{service}?"
+ theme:
+ heading: "Theming"
+ lead: "Welcome to the Theme Editor!"
+ body_html: |
+ Here you'll be able to modify your Retrospring experience by adjusting all available colors.
+ To further help you with adjusting needs, there are a few example elements using the specified colors, and sections will include
+ descriptions on their general use on the site!
+ And with that: Happy Theming!
+ delete: "Delete Theme"
+ general:
+ heading: "General"
+ body: "Here you'll find general page values that are basically visible all across the page."
+ colors:
+ heading: "Colors"
+ body: |
+ Colors you can find used on the site. The names of the colors usually describe the context.
+ The "text" colors for all styles represent the color that text on top of these colors has.
+ alert:
+ example: "A simple %{type} alert — check it out!"
+ type:
+ danger: "danger"
+ info: "info"
+ primary: "primary"
+ success: "success"
+ warning: "warning"
+ button:
+ example: "A %{type} button"
+ type:
+ dark: "dark"
+ light: "light"
+ text:
+ example: "Some muted text"
+ forms:
+ heading: "Forms and Inputs"
+ body: "Styles for form inputs, like text fields."
+ raised:
+ heading: "Raised Content"
+ body: "Raised content basically describes all the different boxes and panels you can see across the site."
+ accent:
+ example: "Some text on top of a accented area on a raised element!"
user:
edit:
title: "Profile Settings"
+ edit_theme:
+ title: "Theme Settings"
export:
title: "Export"
diff --git a/config/locales/voc.en.yml b/config/locales/voc.en.yml
index f7e7fd0a..3c50ff5a 100644
--- a/config/locales/voc.en.yml
+++ b/config/locales/voc.en.yml
@@ -2,10 +2,11 @@ en:
voc:
cancel: "Cancel"
close: "Close"
+ confirm: "Are you sure?"
delete: "Delete"
edit: "Edit"
login: "Sign in"
save: "Save changes"
register: "Sign up"
terms: "Terms of Service"
- update: "Update"
+ update: "Update"
\ No newline at end of file