From 5c11c6147e1d1735753f401765195864a6d72257 Mon Sep 17 00:00:00 2001 From: Godwin Date: Tue, 7 Jun 2016 20:43:43 -0700 Subject: [PATCH] Style and accessibility improvments and fixed links in emails --- app/assets/javascripts/main.js | 13 ++++++ app/assets/stylesheets/_application.scss | 46 ++++++++++++------- app/assets/stylesheets/_settings.scss | 20 +++++--- app/helpers/application_helper.rb | 5 ++ app/mailers/user_mailer.rb | 21 +++++---- .../workshop_facilitator_request.html.haml | 2 +- .../workshop_facilitator_request.text.haml | 2 +- ...hop_facilitator_request_approved.html.haml | 2 +- ...hop_facilitator_request_approved.text.haml | 2 +- ...kshop_facilitator_request_denied.html.haml | 2 +- ...kshop_facilitator_request_denied.text.haml | 2 +- ...orkshop_original_content_changed.html.haml | 2 +- ...orkshop_original_content_changed.text.haml | 2 +- .../user_mailer/workshop_translated.html.haml | 2 +- .../user_mailer/workshop_translated.text.haml | 2 +- .../facilitate_request_sent.html.haml | 2 +- config/locales/en.yml | 1 + 17 files changed, 87 insertions(+), 41 deletions(-) diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js index e961998..a1eb38f 100644 --- a/app/assets/javascripts/main.js +++ b/app/assets/javascripts/main.js @@ -13,4 +13,17 @@ if (errorField) { errorField.focus(); } + + var htmlNode = document.documentElement; + document.addEventListener('keydown', function(event) { + if (htmlNode.dataset.input != 'kb' && ["input", "select", "option"].includes("input".toLowerCase())) { + htmlNode.setAttribute('data-input', 'kb'); + } + }); + + document.addEventListener('mousemove', function(event) { + if (htmlNode.dataset.input != 'mouse' && (event.movementX || event.movementY)) { + htmlNode.setAttribute('data-input', 'mouse'); + } + }); })(); diff --git a/app/assets/stylesheets/_application.scss b/app/assets/stylesheets/_application.scss index db038fb..c49fe9d 100644 --- a/app/assets/stylesheets/_application.scss +++ b/app/assets/stylesheets/_application.scss @@ -43,7 +43,8 @@ a { left: 0; opacity: 0; @include _(transition, all 150ms ease-in-out); - @include _(transform, translateY(-1em)); + @include _(transform-origin, 25% 50%); + @include _(transform, scaleX(0)); } &:hover, @@ -52,7 +53,7 @@ a { @include after { border-bottom: 0.1em solid; opacity: 1; - transform: translateY(0); + @include _(transform, scaleX(1)); } } } @@ -1184,6 +1185,10 @@ $header-tilt: 8deg; background-position: 50% 50%; background-color: $colour-2; } + + body.error-403 & { + background-position: 50% 33%; + } } #footer { @@ -1287,25 +1292,34 @@ $header-tilt: 8deg; } } -body :focus, -input[type="submit"]:focus { - @include _(animation, fade-out ease-in-out 500ms infinite alternate both); +html :focus { + outline: 0; } -.check-box-field input:focus + label, -.radio-button-field input:focus + label, -.select-field select:focus { - outline: 0.25rem solid $colour-2; - outline-offset: 0.2rem; - z-index: 1; -} +html[data-input="kb"] { + :focus, + input[type="submit"]:focus, + .check-box-field input:focus + label, + .radio-button-field input:focus + label, + .select-field select:focus, + .workshop-link:focus .title, + #main-nav .nav a:focus .title { + outline: 0.25rem solid rgba($colour-2, 0.5); + outline-offset: 0.2rem; + z-index: 1; + } -body { - input:focus, + #main-nav .logo:focus { + outline-offset: -0.2em; + } + + /*input:focus, textarea:focus, select:focus, - .textarea { - @include _(animation, none); + .textarea {*/ + .workshop-link:focus, + #main-nav .nav a:focus { + outline: none; } } diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss index 2000476..8228909 100644 --- a/app/assets/stylesheets/_settings.scss +++ b/app/assets/stylesheets/_settings.scss @@ -105,7 +105,17 @@ $link-colour: darken($colour-1, 13%); cursor: pointer; @include _(text-stroke, 1px rgba(0, 0, 0, 0.25)); - @include before-and-after { + @include before { + content: ''; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + background-color: rgba(0,0,0,0); + @include _(transition, background-color 150ms ease-in-out); + } + /*@include before-and-after { content: ''; position: absolute; display: block; @@ -124,17 +134,15 @@ $link-colour: darken($colour-1, 13%); @include after { border-style: solid; border-width: 1em 0 1em 1em; - } + }*/ - &:hover, - &:focus, - &:hover, + /*&:hover, &:focus { @include before-and-after { right: -1em; border-left-color: rgba(0, 0, 0, 0.15); } - } + }*/ &:hover, &:focus { @include before { diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 88d286d..58dde4f 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -602,6 +602,9 @@ module ApplicationHelper city = location.data['city'] end + # we need cities for our logic, don't let this continue if we don't have one + return nil unless city.present? + hash = Hash.new hash[:city] = _!(city) unless city.blank? hash[:region] = _("geography.subregions.#{country}.#{region}") unless region.blank? || country.blank? @@ -612,6 +615,8 @@ module ApplicationHelper end def same_city?(location1, location2) + return false unless location1.present? && location2.present? + location1 = location(location1) unless location1.is_a?(String) location2 = location(location2) unless location2.is_a?(String) diff --git a/app/mailers/user_mailer.rb b/app/mailers/user_mailer.rb index c050d34..5031fd6 100644 --- a/app/mailers/user_mailer.rb +++ b/app/mailers/user_mailer.rb @@ -4,6 +4,8 @@ class UserMailer < ActionMailer::Base add_template_helper(ApplicationHelper) include LinguaFrancaHelper + before_filter :set_host + default from: "Bike!Bike! " # Subject can be set in your I18n file at config/locales/en.yml @@ -46,13 +48,11 @@ class UserMailer < ActionMailer::Base def email_confirmation(confirmation) @confirmation = confirmation - @host = UserMailer.default_url_options[:host] @subject = _'email.subject.confirm_email','Please confirm your email address' mail to: confirmation.user.email, subject: @subject end def registration_confirmation(registration) - @host = UserMailer.default_url_options[:host] @registration = registration @conference = Conference.find(@registration.conference_id) @user = User.find(@registration.user_id) @@ -81,7 +81,6 @@ class UserMailer < ActionMailer::Base end def workshop_facilitator_request(workshop, requester, message) - @host = UserMailer.default_url_options[:host] @workshop = workshop @requester = requester addresses = [] @@ -97,7 +96,6 @@ class UserMailer < ActionMailer::Base end def workshop_facilitator_request_approved(workshop, user) - @host = UserMailer.default_url_options[:host] @workshop = workshop @conference = Conference.find(@workshop.conference_id) @user = user @@ -108,7 +106,6 @@ class UserMailer < ActionMailer::Base end def workshop_facilitator_request_denied(workshop, user) - @host = UserMailer.default_url_options[:host] @workshop = workshop @conference = Conference.find(@workshop.conference_id) @user = user @@ -119,7 +116,6 @@ class UserMailer < ActionMailer::Base end def workshop_translated(workshop, data, locale, user, translator) - @host = UserMailer.default_url_options[:host] @workshop = workshop @data = data @locale = locale @@ -143,7 +139,6 @@ class UserMailer < ActionMailer::Base end def workshop_original_content_changed(workshop, data, user, translator) - @host = UserMailer.default_url_options[:host] @workshop = workshop @data = data @user = user @@ -165,7 +160,6 @@ class UserMailer < ActionMailer::Base end def error_report(subject, message, report, exception, request, params, user) - @host = UserMailer.default_url_options[:host] @subject = subject @message = message @report = report @@ -175,4 +169,15 @@ class UserMailer < ActionMailer::Base @user = user mail to: 'goodgodwin@hotmail.com', subject: @subject end + + private + def set_host + if Rails.env.production? + @host = "https://#{I18n.location.to_s}.bikebike.org" + elsif Rails.env.preview? + @host = "https://preview-#{I18n.location.to_s}.bikebike.org" + else + @host = UserMailer.default_url_options[:host] + end + end end diff --git a/app/views/user_mailer/workshop_facilitator_request.html.haml b/app/views/user_mailer/workshop_facilitator_request.html.haml index 7aa65d0..4b16e80 100644 --- a/app/views/user_mailer/workshop_facilitator_request.html.haml +++ b/app/views/user_mailer/workshop_facilitator_request.html.haml @@ -4,7 +4,7 @@ %p =_'email.workshop.paragraph.request_instructions',"You can approve or deny this request on your workshop page: " - - workshop_link = @host + view_workshop_url(@conference.slug, @workshop.id) + - workshop_link = @host + view_workshop_path(@conference.slug, @workshop.id) %a{href: workshop_link}=workshop_link %p=_'email.workshop.paragraph.request_reply_instructions',"You can also reply directly to this email to ask follow-up questions." diff --git a/app/views/user_mailer/workshop_facilitator_request.text.haml b/app/views/user_mailer/workshop_facilitator_request.text.haml index 3ceb90b..37243e8 100644 --- a/app/views/user_mailer/workshop_facilitator_request.text.haml +++ b/app/views/user_mailer/workshop_facilitator_request.text.haml @@ -6,6 +6,6 @@ =_'email.workshop.paragraph.request_instructions',"You can approve or deny this request on your workshop page: " -=@host + view_workshop_url(@conference.slug, @workshop.id) +=@host + view_workshop_path(@conference.slug, @workshop.id) =_'email.workshop.paragraph.request_reply_instructions',"You can also reply directly to this email to ask follow-up questions." diff --git a/app/views/user_mailer/workshop_facilitator_request_approved.html.haml b/app/views/user_mailer/workshop_facilitator_request_approved.html.haml index 05c2d66..9c91290 100644 --- a/app/views/user_mailer/workshop_facilitator_request_approved.html.haml +++ b/app/views/user_mailer/workshop_facilitator_request_approved.html.haml @@ -1,4 +1,4 @@ %p - - workshop_link = link_to (_!@workshop.title), @host + view_workshop_url(@conference.slug, @workshop.id).html_safe + - workshop_link = link_to (_!@workshop.title), @host + view_workshop_path(@conference.slug, @workshop.id).html_safe =_'email.workshop.paragraph.request_approved',"You have been added as a facilitator of #{workshop_link}.", :vars => {:workshop_title => workshop_link} diff --git a/app/views/user_mailer/workshop_facilitator_request_approved.text.haml b/app/views/user_mailer/workshop_facilitator_request_approved.text.haml index 2b7fb4e..f04fc49 100644 --- a/app/views/user_mailer/workshop_facilitator_request_approved.text.haml +++ b/app/views/user_mailer/workshop_facilitator_request_approved.text.haml @@ -1,3 +1,3 @@ =_'email.workshop.paragraph.request_approved',"Your request to become a facilitator of #{@workshop.title} has been approved and you may now edit the workshop.", :vars => {:workshop_title => @workshop.title} -=@host + view_workshop_url(@conference.slug, @workshop.id) +=@host + view_workshop_path(@conference.slug, @workshop.id) diff --git a/app/views/user_mailer/workshop_facilitator_request_denied.html.haml b/app/views/user_mailer/workshop_facilitator_request_denied.html.haml index caaab5f..c9257f7 100644 --- a/app/views/user_mailer/workshop_facilitator_request_denied.html.haml +++ b/app/views/user_mailer/workshop_facilitator_request_denied.html.haml @@ -1,3 +1,3 @@ %p - - workshop_link = link_to (_!@workshop.title), @host + view_workshop_url(@conference.slug, @workshop.id).html_safe + - workshop_link = link_to (_!@workshop.title), @host + view_workshop_path(@conference.slug, @workshop.id).html_safe =_'email.workshop.paragraph.request_denied',"Your request to become a facilitator of #{workshop_link} has been denied. If you think this was in error, you may contact the current facilitators by making another request to facilitate.", :vars => {:workshop_title => workshop_link} diff --git a/app/views/user_mailer/workshop_facilitator_request_denied.text.haml b/app/views/user_mailer/workshop_facilitator_request_denied.text.haml index 85cfae2..16641b9 100644 --- a/app/views/user_mailer/workshop_facilitator_request_denied.text.haml +++ b/app/views/user_mailer/workshop_facilitator_request_denied.text.haml @@ -1,3 +1,3 @@ =_'email.workshop.paragraph.request_denied',"Your request to become a facilitator of #{@workshop.title} has been denied. If you think this was in error, you may contact the current facilitators by making another request to facilitate.", :vars => {:workshop_title => @workshop.title} -=@host + view_workshop_url(@conference.slug, @workshop.id) +=@host + view_workshop_path(@conference.slug, @workshop.id) diff --git a/app/views/user_mailer/workshop_original_content_changed.html.haml b/app/views/user_mailer/workshop_original_content_changed.html.haml index eb91cbd..566bc61 100644 --- a/app/views/user_mailer/workshop_original_content_changed.html.haml +++ b/app/views/user_mailer/workshop_original_content_changed.html.haml @@ -11,5 +11,5 @@ %p =_'email.workshop.paragraph.view_workshop',"You can view the workshop here: " - - workshop_link = view_workshop_url(@workshop.conference.slug, @workshop.id) + - workshop_link = @host + view_workshop_path(@workshop.conference.slug, @workshop.id) %a{href: workshop_link}=workshop_link diff --git a/app/views/user_mailer/workshop_original_content_changed.text.haml b/app/views/user_mailer/workshop_original_content_changed.text.haml index ce110f5..a43449b 100644 --- a/app/views/user_mailer/workshop_original_content_changed.text.haml +++ b/app/views/user_mailer/workshop_original_content_changed.text.haml @@ -22,4 +22,4 @@ =_'email.workshop.paragraph.view_workshop',"You can view the workshop here: " -= view_workshop_url(@workshop.conference.slug, @workshop.id) += @host + view_workshop_path(@workshop.conference.slug, @workshop.id) diff --git a/app/views/user_mailer/workshop_translated.html.haml b/app/views/user_mailer/workshop_translated.html.haml index 4bf1ce8..269cbda 100644 --- a/app/views/user_mailer/workshop_translated.html.haml +++ b/app/views/user_mailer/workshop_translated.html.haml @@ -11,5 +11,5 @@ %p =_'email.workshop.paragraph.view_workshop',"You can view the workshop here: " - - workshop_link = view_workshop_url(@workshop.conference.slug, @workshop.id) + - workshop_link = @host + view_workshop_path(@workshop.conference.slug, @workshop.id) %a{href: workshop_link}=workshop_link diff --git a/app/views/user_mailer/workshop_translated.text.haml b/app/views/user_mailer/workshop_translated.text.haml index 83c7de6..34e2ff8 100644 --- a/app/views/user_mailer/workshop_translated.text.haml +++ b/app/views/user_mailer/workshop_translated.text.haml @@ -22,4 +22,4 @@ =_'email.workshop.paragraph.view_workshop',"You can view the workshop here: " -= view_workshop_url(@workshop.conference.slug, @workshop.id) += view_workshop_path(@workshop.conference.slug, @workshop.id) diff --git a/app/views/workshops/facilitate_request_sent.html.haml b/app/views/workshops/facilitate_request_sent.html.haml index bc4ecf1..28f7c78 100644 --- a/app/views/workshops/facilitate_request_sent.html.haml +++ b/app/views/workshops/facilitate_request_sent.html.haml @@ -7,5 +7,5 @@ =m('articles.workshops.paragraphs.facilitate_request_sent','Your request has been sent. You will receive an email once your request is approved or denied or if the current facilitators have any questions.') = columns(medium: 12) do .actions - = link_to (_'actions.workshops.View'), view_workshop_url(@this_conference.slug, @workshop.id), :class => 'button' + = link_to (_'actions.workshops.View'), @host + view_workshop_path(@this_conference.slug, @workshop.id), :class => 'button' = link_to (_'actions.workshops.View_All'), register_step_path(@this_conference.slug, :wokshops), :class => 'button' diff --git a/config/locales/en.yml b/config/locales/en.yml index 26a2232..5b5766f 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -5665,6 +5665,7 @@ en: Deny: Deny Facilitate: Make a facilitation request Remove: Remove + Make_Owner: Transfer Ownership View: View this workshop View_All: View all workshops conference: