Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: Remove Helvetica from our font stack (#11876) 

Arial is more consistently available across operating systems and aligns better.
This commit is contained in:
Kris 2021-02-05 17:01:21 -05:00 committed by GitHub
parent 015ea28778
commit ded0f5b4e5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 61 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Gemfile.lock
View File

@ -106,7 +106,7 @@ GEM
jquery-rails (>= 1.0.17)
railties (>= 3.1)
discourse-ember-source (3.12.2.2)
discourse-fonts (0.0.5)
discourse-fonts (0.0.6)
discourse_image_optim (0.26.2)
exifr (~> 1.2, >= 1.2.2)
fspath (~> 3.0)

2
app/assets/javascripts/discourse/app/lib/update-tab-count.js
View File

@ -18,7 +18,7 @@ function renderIcon(canvas, img, count) {
canvas.height = canvas.width = img.width;
let ctx = canvas.getContext("2d");
ctx.font = `bold ${fontSize}px Helvetica, Arial, sans-serif`;
ctx.font = `bold ${fontSize}px Arial, sans-serif`;
if (count) {
ctx.globalAlpha = 0.4;

2
app/assets/stylesheets/common/base/username_tagsinput.scss
View File

@ -19,7 +19,6 @@ div.tagsinput span.tag {
color: #638421;
margin-right: 5px;
margin-bottom: 5px;
font-family: helvetica;
font-size: $font-down-1;
}
@ -31,7 +30,6 @@ div.tagsinput span.tag a {
}
div.tagsinput input {
width: 80px;
font-family: helvetica;
font-size: $font-down-1;
border: 1px solid transparent;
padding: 2px 5px;

2
app/assets/stylesheets/vendor/pikaday.scss vendored
View File

@ -28,7 +28,7 @@ $pd-day-disabled-color: var(--primary) !default;
$pd-week-color: var(--primary) !default;
// Font
$pd-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$pd-font-family: Arial, sans-serif !default;
.pika-single {

2
app/assets/stylesheets/wizard.scss
View File

@ -714,7 +714,7 @@ body.wizard {
line-height: $line-height-large;
font-size: 15px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
Oxygen-Sans, Ubuntu, Cantarell, Arial, sans-serif;
#wizard-main {
display: flex;

65
app/views/email/default_template.html
View File

@ -1,26 +1,49 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="%{html_lang}" xml:lang="%{html_lang}">
<html
xmlns="http://www.w3.org/1999/xhtml"
lang="%{html_lang}"
xml:lang="%{html_lang}"
>
<head>
<meta
http-equiv="Content-type"
name="viewport"
content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width"
/>
<!-- prevent ios zooming + autoscaling -->
<meta name="x-apple-disable-message-reformatting" />
<title></title>
</head>
<head>
<meta http-equiv="Content-type" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
<!-- prevent ios zooming + autoscaling -->
<meta name="x-apple-disable-message-reformatting" />
<title></title>
</head>
<body>
<!--[if mso]>
<style type="text/css">
body,
table,
td,
th,
h1,
h2,
h3 {
font-family: Arial, sans-serif !important;
}
</style>
<![endif]-->
<body>
%{email_content}
<!--[if mso]>
<style type="text/css">
body, table, td, th, h1, h2, h3 {font-family: Helvetica, Arial, sans-serif !important;}
</style>
<![endif]-->
%{email_content}
<!-- prevent Gmail on iOS font size manipulation -->
<div style="display:none;white-space:nowrap;font:15px courier;line-height:0">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div>
</body>
<!-- prevent Gmail on iOS font size manipulation -->
<div
style="
display: none;
white-space: nowrap;
font: 15px courier;
line-height: 0;
"
>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
</div>
</body>
</html>

2
app/views/offline/offline.html.erb
View File

@ -6,7 +6,7 @@
<title><%= SiteSetting.title %></title>
</head>
<body>
<div style="padding:100px 40px; text-align:center; font-family: Helvetica, Arial, sans-serif;">
<div style="padding:100px 40px; text-align:center; font-family: Arial, sans-serif;">
<h1 style="font-size: 36px; color: #333;"><%= t 'offline.title' %></h1>
<p style="margin: 40px; font-size: 18px; color: #555;">
<%= t 'offline.offline_page_message' %>

14
app/views/user_notifications/digest.html.erb
View File

@ -15,7 +15,7 @@
<%- else %>
<table class="digest-header text-header with-dir" style="background-color:#<%= @header_bgcolor -%>;width:100%;">
<tr>
<td align="center" style="text-align: center;padding: 20px 0; font-family:Helvetica,Arial,sans-serif;">
<td align="center" style="text-align: center;padding: 20px 0; font-family:Arial,sans-serif;">
<a href="<%= Discourse.base_url %>" style="color:#<%= @header_color -%>;font-size:22px;text-decoration:none;">
<%- if logo_url.blank? %>
@ -30,7 +30,7 @@
</table>
<%- end %>
<table class="body digest-content with-dir" style="width:100%;background:#f3f3f3;padding:0;border-spacing:0;font-family:Helvetica,Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;vertical-align:top;">
<table class="body digest-content with-dir" style="width:100%;background:#f3f3f3;padding:0;border-spacing:0;font-family:Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;vertical-align:top;">
<tr>
<td class="side-spacer" style="width:5%;vertical-align:top;padding:0;">
<div class="with-accent-colors">
@ -43,7 +43,7 @@
</table>
</div>
</td>
<td style="vertical-align:top;padding:0;font-family:Helvetica,Arial,sans-serif;">
<td style="vertical-align:top;padding:0;font-family:Arial,sans-serif;">
<table align="center" class="digest-content-header with-accent-colors with-dir" style="border-spacing:0;margin:0;padding:0;vertical-align:top;width:100%">
<tbody>
<tr>
@ -219,11 +219,11 @@
<% if @popular_posts.present? %>
<center class="header-popular-posts" style="color:#0a0a0a;background:#f3f3f3;font-size:22px;font-weight:400;padding: 20px 0;font-family:Helvetica,Arial,sans-serif;">
<center class="header-popular-posts" style="color:#0a0a0a;background:#f3f3f3;font-size:22px;font-weight:400;padding: 20px 0;font-family:Arial,sans-serif;">
<%=t 'user_notifications.digest.popular_posts' %>
</center>
<table class="body with-dir" style="width:100%;background:#f3f3f3;border-spacing:0;border-collapse:collapse!important;font-family:Helvetica,Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;padding:0;vertical-align:top;">
<table class="body with-dir" style="width:100%;background:#f3f3f3;border-spacing:0;border-collapse:collapse!important;font-family:Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;padding:0;vertical-align:top;">
<tr>
<td class="side-spacer" style="width:5%;padding:0;">&nbsp;</td>
<td class="with-dir" align="center" valign="top" style="width:90%;border-collapse:collapse!important;line-height:1.3;margin:0;padding:0;vertical-align:top;">
@ -297,9 +297,9 @@
<%= digest_custom_html("above_popular_topics") %>
<% if @other_new_for_you.present? %>
<center class="digest-new-header" style="color:#0a0a0a;background:#f3f3f3;font-size:22px;font-weight:400;padding-bottom: 8px;font-family:Helvetica,Arial,sans-serif;mso-line-height-rule:exactly;line-height:36px;"><%=t 'user_notifications.digest.more_new' %></center>
<center class="digest-new-header" style="color:#0a0a0a;background:#f3f3f3;font-size:22px;font-weight:400;padding-bottom: 8px;font-family:Arial,sans-serif;mso-line-height-rule:exactly;line-height:36px;"><%=t 'user_notifications.digest.more_new' %></center>
<table class="digest-new-topics body with-dir" style="width:100%;background:#f3f3f3;border-spacing:0;border-collapse:collapse!important;font-family:Helvetica,Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;padding:0;vertical-align:top;">
<table class="digest-new-topics body with-dir" style="width:100%;background:#f3f3f3;border-spacing:0;border-collapse:collapse!important;font-family:Arial,sans-serif;font-size:14px;font-weight:200;line-height:1.3;padding:0;vertical-align:top;">
<tr>
<td class="side-spacer" style="width:5%;padding:0;">&nbsp;</td>
<td align="center" valign="top" style="width:90%;border-collapse:collapse!important;margin:0;padding:0;">

4
config/site_settings.yml
View File

@ -333,11 +333,11 @@ basic:
default: ""
hidden: true
base_font:
default: "helvetica"
default: "arial"
enum: "BaseFontSetting"
refresh: true
heading_font:
default: "helvetica"
default: "arial"
enum: "BaseFontSetting"
refresh: true

2
lib/email/styles.rb
View File

@ -203,7 +203,7 @@ module Email
style('code', 'background-color: #f1f1ff; padding: 2px 5px;')
style('pre code', 'display: block; background-color: #f1f1ff; padding: 5px;')
style('.featured-topic a', "text-decoration: none; font-weight: bold; color: #{SiteSetting.email_link_color}; line-height:1.5em;")
style('.summary-email', "-moz-box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-box-sizing:border-box;-webkit-text-size-adjust:100%;box-sizing:border-box;color:#0a0a0a;font-family:Helvetica,Arial,sans-serif;font-size:14px;font-weight:400;line-height:1.3;margin:0;min-width:100%;padding:0;width:100%")
style('.summary-email', "-moz-box-sizing:border-box;-ms-text-size-adjust:100%;-webkit-box-sizing:border-box;-webkit-text-size-adjust:100%;box-sizing:border-box;color:#0a0a0a;font-family:Arial,sans-serif;font-size:14px;font-weight:400;line-height:1.3;margin:0;min-width:100%;padding:0;width:100%")
style('.previous-discussion', 'font-size: 17px; color: #444; margin-bottom:10px;')
style('.notification-date', "text-align:right;color:#999999;padding-right:5px;font-family:'lucida grande',tahoma,verdana,arial,sans-serif;font-size:11px")

2
plugins/lazy-yt/assets/stylesheets/lazyYT.css
View File

@ -38,7 +38,7 @@
width: 100%;
height: 30px;
overflow: hidden;
font-family: Arial, Helvetica, sans-serif;
font-family: Arial, sans-serif;
font-size: 12px;
color: #fff;
background-color: rgba(0, 0, 0, 0.8);

2
spec/components/stylesheet/importer_spec.rb
View File

@ -37,7 +37,7 @@ describe Stylesheet::Importer do
it "includes font variable" do
expect(compile_css("desktop"))
.to include(":root{--font-family: Helvetica, Arial, sans-serif}")
.to include(":root{--font-family: Arial, sans-serif}")
end
it "includes separate body and heading font declarations" do