Skip to content

Commit

Permalink
Fix wrong aspect ratio of logo in icons (mastodon#18639)
Browse files Browse the repository at this point in the history
  • Loading branch information
Gargron authored Jun 11, 2022
1 parent e3cebfa commit fe2d6fe
Show file tree
Hide file tree
Showing 13 changed files with 13 additions and 14 deletions.
2 changes: 1 addition & 1 deletion app/helpers/branding_helper.rb
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ def _logo_as_symbol_wordmark
end

def _logo_as_symbol_icon
content_tag(:svg, tag(:use, href: '#logo-symbol-icon'), viewBox: '0 0 79 75', class: 'logo logo--icon')
content_tag(:svg, tag(:use, href: '#logo-symbol-icon'), viewBox: '0 0 79 79', class: 'logo logo--icon')
end

def render_logo
Expand Down
Binary file modified app/javascript/icons/favicon-16x16.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified app/javascript/icons/favicon-32x32.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified app/javascript/icons/favicon-48x48.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion app/javascript/images/logo-symbol-icon.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion app/javascript/images/logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified app/javascript/images/mailer/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified app/javascript/images/mailer/wordmark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified lib/assets/wordmark.dark.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified lib/assets/wordmark.light.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
21 changes: 10 additions & 11 deletions lib/tasks/branding.rake
Original file line number Diff line number Diff line change
Expand Up @@ -9,28 +9,28 @@ namespace :branding do

desc 'Generate PNG icons and logos for e-mail templates'
task generate_mailer_assets: :environment do
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '-w :w -h :h :input -o :output')
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '-h :size --keep-aspect-ratio :input -o :output')
output_dest = Rails.root.join('app', 'javascript', 'images', 'mailer')

# Displayed size is 64px, at 3x it's 192px
Dir[Rails.root.join('app', 'javascript', 'images', 'icons', '*.svg')].each do |path|
rsvg_convert.run(input: path, w: 192, h: 192, output: output_dest.join("#{File.basename(path, '.svg')}.png"))
rsvg_convert.run(input: path, size: 192, output: output_dest.join("#{File.basename(path, '.svg')}.png"))
end

# Displayed size is 34px, at 3x it's 102px
rsvg_convert.run(input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), w: (102 * (261.0 / 66)).ceil, h: 102, output: output_dest.join('wordmark.png'))
rsvg_convert.run(input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), size: 102, output: output_dest.join('wordmark.png'))

# Displayed size is 24px, at 3x it's 72px
rsvg_convert.run(input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-icon.svg'), w: (72 * (79.0 / 75)).ceil, h: 72, output: output_dest.join('logo.png'))
rsvg_convert.run(input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-icon.svg'), size: 72, output: output_dest.join('logo.png'))
end

desc 'Generate light/dark logotypes for GitHub'
task generate_github_assets: :environment do
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '--stylesheet :stylesheet -w :w -h :h :input -o :output')
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '--stylesheet :stylesheet -h :size --keep-aspect-ratio :input -o :output')
output_dest = Rails.root.join('lib', 'assets')

rsvg_convert.run(stylesheet: Rails.root.join('lib', 'assets', 'wordmark.dark.css'), input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), w: (102 * (261.0 / 66)).ceil, h: 102, output: output_dest.join('wordmark.dark.png'))
rsvg_convert.run(stylesheet: Rails.root.join('lib', 'assets', 'wordmark.light.css'), input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), w: (102 * (261.0 / 66)).ceil, h: 102, output: output_dest.join('wordmark.light.png'))
rsvg_convert.run(stylesheet: Rails.root.join('lib', 'assets', 'wordmark.dark.css'), input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), size: 102, output: output_dest.join('wordmark.dark.png'))
rsvg_convert.run(stylesheet: Rails.root.join('lib', 'assets', 'wordmark.light.css'), input: Rails.root.join('app', 'javascript', 'images', 'logo-symbol-wordmark.svg'), size: 102, output: output_dest.join('wordmark.light.png'))
end

desc 'Generate favicons and app icons from SVG source files'
Expand All @@ -39,7 +39,7 @@ namespace :branding do
app_icon_source = Rails.root.join('app', 'javascript', 'images', 'app-icon.svg')
output_dest = Rails.root.join('app', 'javascript', 'icons')

rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '-w :size -h :size :input -o :output')
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '-w :size -h :size --keep-aspect-ratio :input -o :output')
convert = Terrapin::CommandLine.new('convert', ':input :output')

favicon_sizes = [16, 32, 48]
Expand Down Expand Up @@ -67,12 +67,11 @@ namespace :branding do

desc 'Generate badge icon from SVG source files'
task generate_app_badge: :environment do
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '--stylesheet :stylesheet -w :w -h :h :input -o :output')
rsvg_convert = Terrapin::CommandLine.new('rsvg-convert', '--stylesheet :stylesheet -w :size -h :size --keep-aspect-ratio :input -o :output')
badge_source = Rails.root.join('app', 'javascript', 'images', 'logo-symbol-icon.svg')
source_ratio = 79.0 / 75
output_dest = Rails.root.join('public')
stylesheet = Rails.root.join('lib', 'assets', 'wordmark.light.css')

rsvg_convert.run(stylesheet: stylesheet, input: badge_source, w: (192 * source_ratio).ceil, h: 192, output: output_dest.join('badge.png'))
rsvg_convert.run(stylesheet: stylesheet, input: badge_source, size: 192, output: output_dest.join('badge.png'))
end
end
Binary file modified public/badge.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified public/favicon.ico
Binary file not shown.

0 comments on commit fe2d6fe

Please sign in to comment.