Skip to content

Commit db06131

Browse files
rsmithlalrsmithlal
committed
Add improved mailer layout using application styles
1 parent 4958627 commit db06131

File tree

16 files changed

+221
-27
lines changed

16 files changed

+221
-27
lines changed

‎app/assets/stylesheets/better_together/mailer.scss‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
2+
// New to NL colour palette
3+
$blue-1: #004BA8;
4+
$blue-2: #3E78B2;
5+
$beige: #EAF0CE;
6+
$teal: #5a8f9b;
7+
$beige-light: lighten($beige, 10%);
8+
$green-2: #70A288;
9+
// $green-2: #538068; // variant
10+
// $green-1: #214E34;
11+
// $green-1: #30734C; // variant
12+
$green-1: #406350; // variant
13+
14+
// Assign the gradient to a variable
15+
$nl-gradient: linear-gradient(to right, $blue-1, $blue-2, $green-2, $green-1);
16+
$nl-gradient-reversed: linear-gradient(to right, $green-1, $green-2, $blue-2, $blue-1);
17+
$nl-gradient-blue: linear-gradient(to right, $blue-1, $blue-2);
18+
$nl-gradient-vertical: linear-gradient(to bottom, $blue-1, $blue-2, $green-2, $green-1);
19+
$nl-gradient-blue-vertical: linear-gradient(to bottom, $blue-1, $blue-2);
20+
$nl-gradient-green-vertical: linear-gradient(to bottom, $green-2, $green-1);
21+
22+
// Override the color variables in the host application
23+
$primary: $blue-1; /* Change to a different blue */
24+
$secondary: $blue-2; /* Change to a different green */
25+
$success: $green-2;
26+
$info: $green-1;
27+
$warning: #C9B947;
28+
$danger: #BF4A47;
29+
$text-opposite-theme-color: #222; /* Darker text */
30+
$background-opposite-theme-color: #f0f0f0; /* Lighter background */
31+
$light-background-text-color: #222;
32+
$dark-background-text-color: #f0f0f0;
33+
34+
$colors: (
35+
primary: $primary,
36+
secondary: $secondary,
37+
success: $success,
38+
info: $info,
39+
warning: $warning,
40+
danger: $danger,
41+
);
42+
43+
/* Define SCSS variables for common color properties */
44+
$slider-track-color: lighten($secondary, 10%);
45+
$slider-thumb-border-color: $primary;
46+
$slider-thumb-color: $beige;
47+
$slider-track-height: 6px;
48+
$slider-thumb-size: 15px;
49+
$slider-thumb-border-size: 2px;
50+
51+
// Import the gem's SCSS styles after overriding the variables
52+
@import 'theme';
53+
54+
55+
@import "bootstrap-utilities";
56+
@import "bootstrap/buttons";
57+
58+
@import 'bootstrap';
59+
@import 'devise';
60+
@import 'font-awesome';
61+
@import 'actiontext';
62+
@import 'contact_details';
63+
@import 'content_blocks';
64+
@import 'conversations';
65+
@import 'forms';
66+
@import 'metrics';
67+
@import 'navigation';
68+
@import 'notifications';
69+
@import 'profiles';
70+
@import 'share';
71+
@import 'sidebar_nav';
72+
@import 'trix-extensions/richtext';
73+
74+
75+
76+
#main-nav.mailer,
77+
#footer-pages-nav {
78+
.navbar-brand {
79+
img {
80+
max-width: 70vw;
81+
margin-left: auto;
82+
margin-right: auto;
83+
}
84+
}
85+
.navbar-nav {
86+
flex-direction: row;
87+
justify-content: center;
88+
flex-wrap: wrap;
89+
column-gap: 2rem;
90+
align-items: center;
91+
width: 100%;
92+
}
93+
}

‎app/assets/stylesheets/better_together/theme.scss‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@import "bootstrap/functions";
2+
@import "bootstrap/mixins";
23
@import "bootstrap/variables";
34

45
// Define default color variables (if not overridden by the host app)
@@ -29,6 +30,34 @@ $slider-thumb-border-size: 2px !default;
2930
&:hover, &:focus {
3031
--bs-navbar-brand-hover-color: lighten($light-background-text-color, 10%);
3132
}
33+
34+
img {
35+
max-width: 70vw;
36+
37+
@include media-breakpoint-up(sm) {
38+
max-width: 40vw;
39+
}
40+
41+
@include media-breakpoint-up(md) {
42+
max-width: 30vw;
43+
}
44+
45+
@include media-breakpoint-up(lg) {
46+
max-width: 20vw;
47+
}
48+
49+
@include media-breakpoint-up(xl) {
50+
max-width: 15vw;
51+
}
52+
}
53+
}
54+
55+
.mailer {
56+
.navbar-brand {
57+
img {
58+
max-width: 50vw
59+
}
60+
}
3261
}
3362

3463
.nav-link {

‎app/controllers/better_together/application_controller.rb‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,11 @@ def set_platform_invitation
8383

8484
@platform_invitation = ::BetterTogether::PlatformInvitation.pending.find_by(token: token)
8585

86-
unless @platform_invitation
86+
if @platform_invitation
87+
# Set the locale based on the invitation record
88+
I18n.locale = @platform_invitation.locale if @platform_invitation.locale.present?
89+
session[:locale] = I18n.locale
90+
else
8791
session.delete(:platform_invitation_token)
8892
session.delete(:platform_invitation_expires_at)
8993
end
@@ -181,11 +185,13 @@ def extract_locale_from_accept_language_header
181185

182186
def set_locale
183187
locale = params[:locale] || # Request parameter
188+
session[:locale] || # Session stored locale
184189
current_person&.locale || # Model saved configuration
185190
extract_locale_from_accept_language_header || # Language header - browser config
186191
I18n.default_locale # Set in your config files, english by super-default
187192

188193
I18n.locale = locale
194+
session[:locale] = locale # Store the locale in the session
189195
end
190196

191197
# Its important that the location is NOT stored if:

‎app/controllers/concerns/better_together/devise_locales.rb‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ module DeviseLocales
1010
before_action :set_locale
1111
end
1212

13-
def set_locale
14-
I18n.locale = params[:locale]
15-
end
13+
# def set_locale
14+
# I18n.locale = params[:locale]
15+
# end
1616
end
1717
end

‎app/mailers/better_together/application_mailer.rb‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,21 @@ class ApplicationMailer < ActionMailer::Base
77
'DEFAULT_FROM_EMAIL',
88
'Better Together Community <[email protected]>'
99
)
10+
11+
helper BetterTogether::ApplicationHelper
12+
helper BetterTogether::ContactDetailsHelper
13+
helper BetterTogether::NavigationItemsHelper
14+
1015
layout 'better_together/mailer'
1116

1217
around_action :set_locale_and_time_zone
1318

1419
attr_accessor :time_zone, :locale
1520

1621
def default_url_options
17-
super.merge(locale:)
22+
options = super.merge(locale:, host: BetterTogether.base_url)
23+
ActiveStorage::Current.url_options = options
24+
options
1825
end
1926

2027
private

‎app/views/better_together/navigation_items/_navigation_item.html.erb‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,15 @@
55
<% if navigation_item.visible? %>
66
<li class="nav-item <%= 'dropdown' if navigation_item.children? %>">
77
<%= link_to navigation_item.title, navigation_item.url,
8-
class: nav_link_classes(navigation_item, path: params[:path] || url_for(controller: params[:controller], action: params[:action])),
8+
class: nav_link_classes(navigation_item,
9+
path: (
10+
params[:path] ||
11+
(url_for(
12+
controller: params[:controller],
13+
action: params[:action]
14+
) if params[:controller].present?)
15+
)
16+
),
917
id: dropdown_id(navigation_item),
1018
role: dropdown_role(navigation_item),
1119
data: dropdown_data_attributes(navigation_item) %>

‎app/views/better_together/platform_invitation_mailer/invite.html.erb‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<!-- app/views/better_together/platform_invitation_mailer/invite.html.erb -->
22

3-
<p><%= t('.greeting') %></p>
3+
<p><%= t('.greeting', recipient_name: @invitee_email&.split('@').first) %></p>
44

5-
<p><%= t('.message', platform: @platform.name) %></p>
5+
<p><%= t('.message', platform: @platform.name, inviter: @platform_invitation.inviter) %></p>
66

77
<p><%= link_to t('.link_text'), @invitation_url %></p>
88

@@ -16,4 +16,4 @@
1616

1717
<p><%= t('.ignore') %></p>
1818

19-
<p><%= t('.signature', platform: @platform.name) %></p>
19+
<p><%= t('.signature_html', platform: @platform.name) %></p>

‎app/views/layouts/better_together/_custom_mailer_stylesheets.html.erb‎

Whitespace-only changes.

‎app/views/layouts/better_together/_header.html.erb‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323

2424
<!-- Search Icon -->
2525
<li class="nav-item search" data-bs-toggle="tooltip" data-bs-placement="bottom" title="<%= t('navbar.search_tooltip') %>">
26-
<a class="nav-link<%= ' active' if url_for(controller: params[:controller], action: params[:action]) === search_path %>" href="#search" data-bs-toggle="collapse" data-bs-target="#navbarSearch" aria-expanded="false" aria-controls="navbarSearch">
26+
<a class="nav-link<%= ' active' if params[:controller].present? && url_for(controller: params[:controller], action: params[:action]) === search_path %>" href="#search" data-bs-toggle="collapse" data-bs-target="#navbarSearch" aria-expanded="false" aria-controls="navbarSearch">
2727
<i class="fas fa-search"></i>
2828
</a>
2929
</li>
@@ -33,7 +33,7 @@
3333
<!-- User Auth Nav Item -->
3434
<% if user_signed_in? %>
3535
<li class="nav-item notifications dropdown" data-bs-toggle="tooltip" data-bs-placement="bottom" title="<%= t('navbar.notifications_tooltip') %>">
36-
<a id="notification-icon" class="nav-link position-relative<%= ' active' if url_for(controller: params[:controller], action: params[:action]) === notifications_path %>" href="<%= notifications_path %>" role="button" data-bs-toggle="dropdown" aria-expanded="false">
36+
<a id="notification-icon" class="nav-link position-relative<%= ' active' if params[:controller].present? && url_for(controller: params[:controller], action: params[:action]) === notifications_path %>" href="<%= notifications_path %>" role="button" data-bs-toggle="dropdown" aria-expanded="false">
3737
<i class="fa fa-bell"></i>
3838
<%= unread_notification_count %>
3939
</a>
@@ -59,7 +59,7 @@
5959
<!-- If user is not signed in, show 'Sign In' -->
6060
<li class="nav-item">
6161
<% if valid_platform_invitation_token_present? %>
62-
<%= link_to new_user_registration_path(invitation_code: session[:platform_invitation_token]), class: "nav-link d-flex align-items-center gap-2" do %>
62+
<%= link_to new_user_registration_path(locale: I18n.locale, invitation_code: session[:platform_invitation_token]), class: "nav-link d-flex align-items-center gap-2" do %>
6363
<i class="fas fa-envelope-open-text"></i>
6464
<%= t('navbar.accept_invitation') %>
6565
<% expires_at_unix = invitation_token_expires_at %>

‎app/views/layouts/better_together/mailer.html.erb‎

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,25 @@
1-
21
<!DOCTYPE html>
32
<html>
43
<head>
5-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6-
<style>/* Email styles need to be inline */</style>
4+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5+
<meta name="x-apple-disable-message-reformatting">
6+
<meta http-equiv="x-ua-compatible" content="ie=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no">
9+
<%= stylesheet_link_tag 'better_together/mailer' %>
10+
<!-- Custom Stylesheets from Host App -->
11+
<%= render 'layouts/better_together/custom_mailer_stylesheets' %>
712
</head>
8-
<body><%= yield %></body>
13+
14+
<body>
15+
<%= content_for?(:custom_header) ? yield(:custom_header) : render('layouts/better_together/mailers/header') %>
16+
<div class="container mt-4 card border-secondary border-1">
17+
<div class="content card-body p-4">
18+
<%= yield %>
19+
</div>
20+
</div>
21+
22+
<!-- Custom Footer from Host App -->
23+
<%= content_for?(:custom_footer) ? yield(:custom_footer) : render('layouts/better_together/mailers/footer') %>
24+
</body>
925
</html>

0 commit comments

Comments
 (0)