github-mirror/discourse
github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-03-19 16:56:40 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

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

Browse Source 
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) jquery-rails (>= 1.0.17)
railties (>= 3.1) railties (>= 3.1)
discourse-ember-source (3.12.2.2) discourse-ember-source (3.12.2.2)
discourse-fonts (0.0.5) discourse-fonts (0.0.6)
discourse_image_optim (0.26.2) discourse_image_optim (0.26.2)
exifr (~> 1.2, >= 1.2.2) exifr (~> 1.2, >= 1.2.2)
fspath (~> 3.0) 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; canvas.height = canvas.width = img.width;
let ctx = canvas.getContext("2d"); let ctx = canvas.getContext("2d");
ctx.font = `bold ${fontSize}px Helvetica, Arial, sans-serif`; ctx.font = `bold ${fontSize}px Arial, sans-serif`;
if (count) { if (count) {
ctx.globalAlpha = 0.4; 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; color: #638421;
margin-right: 5px; margin-right: 5px;
margin-bottom: 5px; margin-bottom: 5px;
font-family: helvetica;
font-size: $font-down-1; font-size: $font-down-1;
} }
@ -31,7 +30,6 @@ div.tagsinput span.tag a {
} }
div.tagsinput input { div.tagsinput input {
width: 80px; width: 80px;
font-family: helvetica;
font-size: $font-down-1; font-size: $font-down-1;
border: 1px solid transparent; border: 1px solid transparent;
padding: 2px 5px; 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; $pd-week-color: var(--primary) !default;
// Font // Font
$pd-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default; $pd-font-family: Arial, sans-serif !default;
.pika-single { .pika-single {

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

@ -714,7 +714,7 @@ body.wizard {
line-height: $line-height-large; line-height: $line-height-large;
font-size: 15px; font-size: 15px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 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 { #wizard-main {
display: flex; 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"> <!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> <body>
<meta http-equiv="Content-type" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width"> <!--[if mso]>
<!-- prevent ios zooming + autoscaling --> <style type="text/css">
<meta name="x-apple-disable-message-reformatting" /> body,
<title></title> table,
</head> td,
th,
h1,
h2,
h3 {
font-family: Arial, sans-serif !important;
}
</style>
<![endif]-->
<body> %{email_content}
<!--[if mso]> <!-- prevent Gmail on iOS font size manipulation -->
<style type="text/css"> <div
body, table, td, th, h1, h2, h3 {font-family: Helvetica, Arial, sans-serif !important;} style="
</style> display: none;
<![endif]--> white-space: nowrap;
font: 15px courier;
%{email_content} line-height: 0;
"
<!-- 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; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
</body> </div>
</body>
</html> </html>

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

@ -6,7 +6,7 @@
<title><%= SiteSetting.title %></title> <title><%= SiteSetting.title %></title>
</head> </head>
<body> <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> <h1 style="font-size: 36px; color: #333;"><%= t 'offline.title' %></h1>
<p style="margin: 40px; font-size: 18px; color: #555;"> <p style="margin: 40px; font-size: 18px; color: #555;">
<%= t 'offline.offline_page_message' %> <%= t 'offline.offline_page_message' %>

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

@ -15,7 +15,7 @@
<%- else %> <%- else %>
<table class="digest-header text-header with-dir" style="background-color:#<%= @header_bgcolor -%>;width:100%;"> <table class="digest-header text-header with-dir" style="background-color:#<%= @header_bgcolor -%>;width:100%;">
<tr> <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;"> <a href="<%= Discourse.base_url %>" style="color:#<%= @header_color -%>;font-size:22px;text-decoration:none;">
<%- if logo_url.blank? %> <%- if logo_url.blank? %>
@ -30,7 +30,7 @@
</table> </table>
<%- end %> <%- 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> <tr>
<td class="side-spacer" style="width:5%;vertical-align:top;padding:0;"> <td class="side-spacer" style="width:5%;vertical-align:top;padding:0;">
<div class="with-accent-colors"> <div class="with-accent-colors">
@ -43,7 +43,7 @@
</table> </table>
</div> </div>
</td> </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%"> <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> <tbody>
<tr> <tr>
@ -219,11 +219,11 @@
<% if @popular_posts.present? %> <% 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' %> <%=t 'user_notifications.digest.popular_posts' %>
</center> </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> <tr>
<td class="side-spacer" style="width:5%;padding:0;">&nbsp;</td> <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;"> <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") %> <%= digest_custom_html("above_popular_topics") %>
<% if @other_new_for_you.present? %> <% 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> <tr>
<td class="side-spacer" style="width:5%;padding:0;">&nbsp;</td> <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;"> <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: "" default: ""
hidden: true hidden: true
base_font: base_font:
default: "helvetica" default: "arial"
enum: "BaseFontSetting" enum: "BaseFontSetting"
refresh: true refresh: true
heading_font: heading_font:
default: "helvetica" default: "arial"
enum: "BaseFontSetting" enum: "BaseFontSetting"
refresh: true refresh: true

2
lib/email/styles.rb
View File

@ -203,7 +203,7 @@ module Email
style('code', 'background-color: #f1f1ff; padding: 2px 5px;') style('code', 'background-color: #f1f1ff; padding: 2px 5px;')
style('pre code', 'display: block; background-color: #f1f1ff; padding: 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('.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('.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") 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%; width: 100%;
height: 30px; height: 30px;
overflow: hidden; overflow: hidden;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, sans-serif;
font-size: 12px; font-size: 12px;
color: #fff; color: #fff;
background-color: rgba(0, 0, 0, 0.8); 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 it "includes font variable" do
expect(compile_css("desktop")) expect(compile_css("desktop"))
.to include(":root{--font-family: Helvetica, Arial, sans-serif}") .to include(":root{--font-family: Arial, sans-serif}")
end end
it "includes separate body and heading font declarations" do it "includes separate body and heading font declarations" do