More copy and design edits

app/mailers/application_mailer.rb

@@ -1,5 +1,5 @@
 class ApplicationMailer < ActionMailer::Base
-  default from: "The Fizzy team <support@37signals.com>"
+  default from: "Fizzy <support@37signals.com>"
 
   layout "mailer"
   append_view_path Rails.root.join("app/views/mailers")

app/mailers/magic_link_mailer.rb

@@ -3,7 +3,7 @@ class MagicLinkMailer < ApplicationMailer
     @magic_link = magic_link
     @identity = @magic_link.identity
 
-    mail to: @identity.email_address, subject: "Confirm your email"
+    mail to: @identity.email_address, subject: "Your Fizzy verification code"
   end
 
   private

app/views/mailers/magic_link_mailer/sign_in_instructions.html.erb

@@ -1,10 +1,13 @@
-<p class="subtitle">Hit the button below to confirm your email.</p>
 
-<%= link_to "Confirm and return to Fizzy", session_magic_link_url(code: @magic_link.code), class: "btn" %>
+<% if !@identity.memberships.any? %>
+  <h1 class="title">Fizzy verification code</h1>
+  <p class="subtitle">Please enter this 6-character verification code on the Fizzy sign-in page:</p>
+<% else %>
+  <h1 class="title">Welcome to Fizzy!</h1>
+  <p class="subtitle">Please enter this 6-character verification code on the Fizzy sign-up page to create your new account:</p>
+<% end %>
 
-<p class="margin-block-start-double">If Fizzy is on another device, enter this special code instead:
-  <br><strong class="txt-large"><%= @magic_link.code %></strong>
-</p>
+<strong class="txt-large"><%= @magic_link.code %></strong>
 
 <p class="footer">Need help? <%= mail_to "support@37signals.com", "Email us"%>.
 </p>

app/views/mailers/magic_link_mailer/sign_in_instructions.text.erb

@@ -1,6 +1,7 @@
-Hit the button below to confirm your email:
+<% if @identity.memberships.any? %>
+Please enter this 6-character verification code on the Fizzy sign-in page:
+<% else %>
+Please enter this 6-character verification code on the Fizzy sign-up page to create your new account:
+<% end %>
 
-<%= session_magic_link_url(code: @magic_link.code) %>
-
-If Fizzy is on another device, enter this special code instead:
 <%= @magic_link.code %>

app/views/sessions/magic_links/show.html.erb

@@ -3,14 +3,12 @@
 <div class="panel panel--centered flex flex-column gap-half <%= "shake" if flash[:alert] %>">
   <header>
     <h1 class="txt-x-large font-weight-black margin-none"><%= @page_title %></h1>
-    <p class="margin-none-block-start txt-medium">Then hit the link to continue</p>
+    <p class="margin-none-block-start txt-medium">Then enter the verfifcation code included in the email below:</p>
   </header>
 
-  <p class="margin-none-block-start margin-block-end-half txt-small txt-subtle">If your email is on a different device, enter the code included in the email below.</p>
-
   <%= form_with url: session_magic_link_path, method: :post, html: { data: { controller: token_list("form", "auto-submit" => params[:code].present?)} } do |form| %>
-    <%= form.text_field :code, required: true, class: "input center txt-align-enter txt-normal",
-        autofocus: false, autocorrect: "off", autocapitalize: "off", spellcheck: "false", "data-1p-ignore": true,
+    <%= form.text_field :code, required: true, class: "input center txt-align-enter txt-large",
+        autofocus: true, autocorrect: "off", autocapitalize: "off", spellcheck: "false", "data-1p-ignore": true,
         autocomplete: "one-time-code", maxlength: "6", placeholder: "••••••", value: params[:code],
         data: { form_target: "input", action: "paste->form#debouncedSubmit" } %>
   <% end %>

app/views/sessions/new.html.erb

@@ -1,16 +1,16 @@
 <% @page_title = "Enter your email" %>
 
 <div class="panel panel--centered flex flex-column gap-half" style="--panel-size: 65ch;">
-  <h1 class="txt-x-large font-weight-black margin-block-end">Hi! Let’s get you in to Fizzy</h1>
+  <h1 class="txt-x-large font-weight-black margin-block-end">Let’s get you in to Fizzy</h1>
 
   <%= form_with url: session_path, class: "flex flex-column gap txt-medium" do |form| %>
     <div class="flex align-center gap">
       <label class="flex align-center gap input input--actor">
-        <%= form.email_field :email_address, required: true, class: "input txt-large full-width", autofocus: true, autocomplete: "username", placeholder: "Email address" %>
+        <%= form.email_field :email_address, required: true, class: "input txt-large full-width", autofocus: true, autocomplete: "username", placeholder: "Enter your email address…" %>
       </label>
     </div>
 
-    <p>If you’ve already got a Fizzy account we’ll get you signed in. If you’re new here, we’ll set you up with your own Fizzy account.</p>
+    <p>If you’ve already got an account we’ll get you signed in. If you’re new here, we’ll set you up with your own Fizzy account.</p>
 
     <button type="submit" id="log_in" class="btn btn--link center txt-medium">
       <span>Let’s go</span>

gems/fizzy-saas/app/views/signup/memberships/new.html.erb

@@ -1,12 +1,15 @@
-<% @page_title = "Create your new Fizzy account" %>
+<% @page_title = "Sign up for Fizzy" %>
 
-<div class="panel panel--centered full-width flex flex-column gap-half <%= "shake" if flash[:alert] %>">
-  <h1 class="txt-large font-weight-black margin-none"><%= @page_title %></h1>
+<div class="panel panel--centered flex flex-column gap-half <%= "shake" if flash[:alert] %>">
+  <h1 class="txt-x-large font-weight-black margin-block-end"><%= @page_title %></h1>
 
   <%= form_with model: @signup, url: saas.signup_membership_path, scope: "signup", class: "flex flex-column gap", data: { controller: "form" } do |form| %>
     <%= form.hidden_field :new_user %>
 
-    <%= form.text_field :full_name, class: "input", autocomplete: "name", placeholder: "Full name", autofocus: true, required: true %>
+    <%= form.text_field :full_name, class: "input txt-large", autocomplete: "name", placeholder: "Enter your full name…", autofocus: true, required: true %>
+
+    <p>You’re one step away. Just enter your name to get your own Fizzy account.</p>
+
 
     <% if @signup.errors.any? %>
       <div class="margin-block-half">