Make email address in user profile aggressively wrap

Fixes FOO-2806
flag=none

The "Default Email" field in a user profile page was styled
such that the table cell containing the email address would
not wrap; when the screen size is very narrow that forced the
browser into two-dimensional scrolling which is counter to
WCAG responsive guidelines.

The solution is to force `word-break: break-all` on that field
which does make the email address wrap in some ugly ways but
at least it will fit horizontally. It's still selectable as a
single entity so is useable.

Test plan:
* Be on the main branch
* See the steps to reproduce in the ticket
* Have a user with a default email address like
  incrediblylongcannotbelieveitemail@incrediblylongdomain.edu
* Set your browser to be responsive at 320px width (iPhone 5)
* Notice the horizontal scrolling
* Switch to this commit
* It should now wrap that email address however it needs to
  in order to avoid the horizontal scrolling

Change-Id: I5c2df74756f3b937cf3dc24973904ab4f6cfbea2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/290350
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Sean Scally <sean.scally@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>

app/views/users/_name.html.erb

@@ -62,7 +62,7 @@
       <% if @context.grants_right? @current_user, :read_email_addresses %>
         <tr>
           <th><%= before_label('default_email', 'Default Email') %></th>
-          <td class="email"><%=h @user.email %></td>
+          <td style="word-break: break-all"><%=h @user.email %></td>
         </tr>
       <% end %>
       <tr>