maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update the images section in preparation for Creator Setup and Onboarding Launch [Will deploy on 10/01] (#15989)

Browse source 
* feat: add a section id to the images section

* feat: update the images section

* chore: add some space

* chore: update the descriptiion text for logos
This commit is contained in:
Ridhwana 2022-01-10 16:10:57 +02:00 • committed by GitHub
parent 81571bb0b5
commit 3f582e88c2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/lib/constants/settings/general.rb
View file

@ -36,11 +36,13 @@ module Constants
placeholder: "a secure token"
},
logo_png: {
description: "Used as a fallback to the SVG. Recommended minimum of 512x512px",
description: "Used as a secondary logo in places like the sign in modals, onboarding, apple touch icons. " \
"Recommended minimum of 512x512px",
placeholder: IMAGE_PLACEHOLDER
},
logo_svg: {
description: "Used as the SVG logo of the community",
description: "This is the logo currently used on the upper left hand corner of your Forem. " \
"However, after the release it will be deprecated in favor of the Logo above.",
placeholder: SVG_PLACEHOLDER
},
main_social_image: {

62
app/views/admin/settings/forms/_images.html.erb
View file

@ -1,7 +1,7 @@
<%= form_for(Settings::General.new,
url: admin_settings_general_settings_path,
html: { data: { action: "submit->config#updateConfigurationSettings" } }) do |f| %>
<div class="card mt-3">
<div class="card mt-3" id="images">
<%= render partial: "admin/shared/card_header",
locals: {
header: "Images",
@ -11,6 +11,36 @@
} %>
<div id="imagesBodyContainer" class="card-body collapse hide" aria-labelledby="imagesBodyContainer">
<fieldset class="grid gap-4">
<%= render partial: "admin/shared/logo_upload", locals: { f: f, allowed_types: logo_allowed_types, max_file_size: logo_max_file_size, logo: Settings::General.resized_logo } %>
<div class="crayons-field">
<%= admin_config_label :logo_svg, "SVG logo (soon to be deprecated)" %>
<%= admin_config_description Constants::Settings::General::DETAILS[:logo_svg][:description] %>
<%= f.text_area :logo_svg,
class: "crayons-textfield",
value: Settings::General.logo_svg,
rows: 6,
placeholder: Constants::Settings::General::DETAILS[:logo_svg][:placeholder] %>
<% if Settings::General.logo_svg.present? %>
<div class="site-logo">
<%= Settings::General.logo_svg.html_safe %>
</div>
<% end %>
</div>
<div class="crayons-field">
<%= admin_config_label :logo_png, "Secondary Logo" %>
<%= admin_config_description Constants::Settings::General::DETAILS[:logo_png][:description] %>
<%= f.text_field :logo_png,
class: "crayons-textfield",
value: Settings::General.logo_png,
placeholder: Constants::Settings::General::DETAILS[:logo_png][:placeholder] %>
<% if Settings::General.logo_png.present? %>
<img src="<%= Images::Optimizer.call(Settings::General.logo_png, width: 128) %>" width="128" height="128" loading="lazy" />
<% end %>
</div>
<div class="crayons-field">
<%= admin_config_label :main_social_image %>
<%= admin_config_description Constants::Settings::General::DETAILS[:main_social_image][:description] %>
@ -33,36 +63,6 @@
<img alt="favicon" class="preview" src="<%= Images::Optimizer.call(Settings::General.favicon_url, width: 32) %>" width="32" height="32" loading="lazy" />
</div>
<div class="crayons-field">
<%= admin_config_label :logo_png %>
<%= admin_config_description Constants::Settings::General::DETAILS[:logo_png][:description] %>
<%= f.text_field :logo_png,
class: "crayons-textfield",
value: Settings::General.logo_png,
placeholder: Constants::Settings::General::DETAILS[:logo_png][:placeholder] %>
<% if Settings::General.logo_png.present? %>
<img src="<%= Images::Optimizer.call(Settings::General.logo_png, width: 128) %>" width="128" height="128" loading="lazy" />
<% end %>
</div>
<% if FeatureFlag.enabled?(:creator_onboarding) %>
<%= render partial: "admin/shared/logo_upload", locals: { f: f, allowed_types: logo_allowed_types, max_file_size: logo_max_file_size, logo: Settings::General.resized_logo } %>
<% else %>
<div class="crayons-field">
<%= admin_config_label :logo_svg %>
<%= admin_config_description Constants::Settings::General::DETAILS[:logo_svg][:description] %>
<%= f.text_area :logo_svg,
class: "crayons-textfield",
value: Settings::General.logo_svg,
rows: 6,
placeholder: Constants::Settings::General::DETAILS[:logo_svg][:placeholder] %>
<% if Settings::General.logo_svg.present? %>
<div class="site-logo">
<%= Settings::General.logo_svg.html_safe %>
</div>
<% end %>
</div>
<% end %>
</fieldset>
<%= render "update_setting_button", f: f, aria_label: "Update image settings" %>
</div>

8
app/views/admin/shared/_logo_upload.html.erb
View file

@ -2,7 +2,13 @@
<%= f.label :logo, class: "crayons-field__label" do %>
Logo
<% end %>
<p id="logo-subtitle" class="crayons-field__description">Your logo will display in the upper left hand corner of your Forem. Upload a PNG or JPEG with a maximum size of 4096x4096px.</p>
<% if FeatureFlag.enabled?(:creator_onboarding) %>
<p id="logo-subtitle" class="crayons-field__description">Your logo will display in the upper left hand corner of your Forem. Upload a PNG or JPEG with a maximum size of 4096x4096px.</p>
<% else %>
<p id="logo-subtitle" class="crayons-field__description">You can adjust what your logo will look like here but it will not be live on the visitor facing site until after the release on 17 January. Upload a PNG or JPEG with a maximum size of 4096x4096px.</p>
<% end %>
<div class="flex flex-1 gap-4">
<%= f.file_field :logo, accept: allowed_types.to_s, aria_describedby: "logo-subtitle", data: { "max-file-size-mb": max_file_size.to_s, action: "change->logo-upload#previewLogo" } %>
<div data-logo-upload-target="previewLogo" id="logo-upload-preview">