FEATURE: Support using system font in wizard font step (#10742)

Co-authored-by: Bianca Nenciu <nbianca@users.noreply.github.com>
This commit is contained in:
Penar Musaraj
2020-09-25 09:39:14 -04:00
committed by GitHub
parent 8fcfb9586c
commit b1692422b1
5 changed files with 14 additions and 5 deletions

View File

@ -105,7 +105,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.3) discourse-fonts (0.0.4)
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)

View File

@ -37,7 +37,6 @@ export default createPreviewComponent(305, 165, {
paint(ctx, colors, font, width, height) { paint(ctx, colors, font, width, height) {
const headerHeight = height * 0.3; const headerHeight = height * 0.3;
this.drawFullHeader(colors, font); this.drawFullHeader(colors, font);
const margin = width * 0.04; const margin = width * 0.04;

View File

@ -80,7 +80,7 @@ const Wizard = EmberObject.extend({
return; return;
} }
return option.data.font_stack.split(",")[0]; return option.data.name;
}, },
}); });

View File

@ -62,6 +62,15 @@ module Stylesheet
contents = +"" contents = +""
DiscourseFonts.fonts.each do |font| DiscourseFonts.fonts.each do |font|
if font[:key] == "system"
# Overwrite font definition because the preview canvases in the wizard require explicit @font-face definitions.
# uses same technique as https://github.com/jonathantneal/system-font-css
font[:variants] = [
{ src: 'local(".SFNS-Regular"), local(".SFNSText-Regular"), local(".HelveticaNeueDeskInterface-Regular"), local(".LucidaGrandeUI"), local("Segoe UI"), local("Ubuntu"), local("Roboto-Regular"), local("DroidSans"), local("Tahoma")', weight: 400 },
{ src: 'local(".SFNS-Bold"), local(".SFNSText-Bold"), local(".HelveticaNeueDeskInterface-Bold"), local(".LucidaGrandeUI"), local("Segoe UI Bold"), local("Ubuntu Bold"), local("Roboto-Bold"), local("DroidSans-Bold"), local("Tahoma Bold")', weight: 700 }
]
end
contents << font_css(font) contents << font_css(font)
contents << <<~EOF contents << <<~EOF
.font-#{font[:key].tr("_", "-")} { .font-#{font[:key].tr("_", "-")} {
@ -266,10 +275,11 @@ module Stylesheet
if font[:variants].present? if font[:variants].present?
font[:variants].each do |variant| font[:variants].each do |variant|
src = variant[:src] ? variant[:src] : "asset-url(\"/fonts/#{variant[:filename]}?v=#{DiscourseFonts::VERSION}\") format(\"#{variant[:format]}\")"
contents << <<~EOF contents << <<~EOF
@font-face { @font-face {
font-family: #{font[:name]}; font-family: #{font[:name]};
src: asset-url("/fonts/#{variant[:filename]}?v=#{DiscourseFonts::VERSION}") format("#{variant[:format]}"); src: #{src};
font-weight: #{variant[:weight]}; font-weight: #{variant[:weight]};
} }
EOF EOF

View File

@ -217,7 +217,7 @@ class Wizard
) )
DiscourseFonts.fonts.each do |font| DiscourseFonts.fonts.each do |font|
field.add_choice(font[:key], data: { class: font[:key].tr("_", "-"), font_stack: font[:stack] }) field.add_choice(font[:key], data: { class: font[:key].tr("_", "-"), name: font[:name] })
end end
step.on_update do |updater| step.on_update do |updater|