2019-05-02 18:17:27 -04:00
|
|
|
# frozen_string_literal: true
|
|
|
|
|
2017-05-08 11:38:48 -04:00
|
|
|
require_dependency 'global_path'
|
2017-04-12 10:52:52 -04:00
|
|
|
|
|
|
|
module Stylesheet
|
2021-03-12 11:17:42 -05:00
|
|
|
class Importer
|
2017-05-08 11:38:48 -04:00
|
|
|
include GlobalPath
|
2017-04-12 10:52:52 -04:00
|
|
|
|
2019-10-01 20:54:31 -04:00
|
|
|
THEME_TARGETS ||= %w{embedded_theme mobile_theme desktop_theme}
|
2019-09-16 12:06:34 -04:00
|
|
|
|
2021-03-12 11:17:42 -05:00
|
|
|
def self.plugin_assets
|
|
|
|
@plugin_assets ||= {}
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
2019-09-16 12:06:34 -04:00
|
|
|
def self.register_imports!
|
|
|
|
Discourse.plugins.each do |plugin|
|
|
|
|
plugin_directory_name = plugin.directory_name
|
2019-08-20 12:39:52 -04:00
|
|
|
|
2019-09-16 12:06:34 -04:00
|
|
|
["", "mobile", "desktop"].each do |type|
|
|
|
|
asset_name = type.present? ? "#{plugin_directory_name}_#{type}" : plugin_directory_name
|
|
|
|
stylesheets = type.present? ? DiscoursePluginRegistry.send("#{type}_stylesheets") : DiscoursePluginRegistry.stylesheets
|
2019-08-20 12:39:52 -04:00
|
|
|
|
2021-03-12 11:17:42 -05:00
|
|
|
plugin_assets[asset_name] = stylesheets[plugin_directory_name] if plugin_directory_name.present?
|
2019-08-20 12:39:52 -04:00
|
|
|
end
|
|
|
|
end
|
2017-04-12 10:52:52 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
end
|
2020-10-05 13:40:41 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
register_imports!
|
2020-10-05 13:40:41 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
def font
|
|
|
|
body_font = DiscourseFonts.fonts.find { |f| f[:key] == SiteSetting.base_font }
|
|
|
|
heading_font = DiscourseFonts.fonts.find { |f| f[:key] == SiteSetting.heading_font }
|
|
|
|
contents = +""
|
2020-09-04 09:25:50 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
if body_font.present?
|
|
|
|
contents << <<~EOF
|
|
|
|
#{font_css(body_font)}
|
2020-09-04 09:25:50 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
:root {
|
|
|
|
--font-family: #{body_font[:stack]};
|
|
|
|
}
|
|
|
|
EOF
|
|
|
|
end
|
2020-09-25 09:39:14 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
if heading_font.present?
|
|
|
|
contents << <<~EOF
|
|
|
|
#{font_css(heading_font)}
|
2020-09-04 09:25:50 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
:root {
|
|
|
|
--heading-font-family: #{heading_font[:stack]};
|
|
|
|
}
|
|
|
|
EOF
|
2020-09-04 09:25:50 -04:00
|
|
|
end
|
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
contents
|
|
|
|
end
|
|
|
|
|
|
|
|
def wizard_fonts
|
|
|
|
contents = +""
|
|
|
|
|
|
|
|
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 }
|
|
|
|
]
|
2019-09-16 12:06:34 -04:00
|
|
|
end
|
2017-04-12 10:52:52 -04:00
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
contents << font_css(font)
|
|
|
|
contents << <<~EOF
|
|
|
|
.body-font-#{font[:key].tr("_", "-")} {
|
|
|
|
font-family: #{font[:stack]};
|
|
|
|
}
|
|
|
|
.heading-font-#{font[:key].tr("_", "-")} h2 {
|
|
|
|
font-family: #{font[:stack]};
|
|
|
|
}
|
|
|
|
EOF
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
contents
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
2021-03-10 11:05:56 -05:00
|
|
|
def category_backgrounds
|
|
|
|
contents = +""
|
|
|
|
Category.where('uploaded_background_id IS NOT NULL').each do |c|
|
|
|
|
contents << category_css(c) if c.uploaded_background&.url.present?
|
|
|
|
end
|
|
|
|
|
|
|
|
contents
|
|
|
|
end
|
2019-09-16 12:06:34 -04:00
|
|
|
|
2021-02-19 11:22:24 -05:00
|
|
|
def import_color_definitions
|
2020-08-06 09:46:17 -04:00
|
|
|
contents = +""
|
|
|
|
DiscoursePluginRegistry.color_definition_stylesheets.each do |name, path|
|
2021-03-10 11:05:56 -05:00
|
|
|
contents << "\n\n// Color definitions from #{name}\n\n"
|
2020-08-06 09:46:17 -04:00
|
|
|
contents << File.read(path.to_s)
|
|
|
|
contents << "\n\n"
|
|
|
|
end
|
2020-08-18 13:02:13 -04:00
|
|
|
|
2021-02-19 11:22:24 -05:00
|
|
|
theme_id = @theme_id || SiteSetting.default_theme_id
|
2021-06-15 02:57:17 -04:00
|
|
|
resolved_ids = Theme.transform_ids(theme_id)
|
2020-09-09 11:43:34 -04:00
|
|
|
|
|
|
|
if resolved_ids
|
2021-02-02 13:09:41 -05:00
|
|
|
theme = Theme.find_by_id(theme_id)
|
|
|
|
contents << theme&.scss_variables.to_s
|
2021-02-04 08:51:18 -05:00
|
|
|
Theme.list_baked_fields(resolved_ids, :common, :color_definitions).each do |field|
|
2021-03-10 11:05:56 -05:00
|
|
|
contents << "\n\n// Color definitions from #{field.theme.name}\n\n"
|
2021-02-04 08:51:18 -05:00
|
|
|
|
|
|
|
if field.theme_id == theme.id
|
|
|
|
contents << field.value
|
|
|
|
else
|
2021-02-19 11:22:24 -05:00
|
|
|
contents << field.compiled_css(prepended_scss)
|
2021-02-04 08:51:18 -05:00
|
|
|
end
|
|
|
|
contents << "\n\n"
|
2020-08-18 13:02:13 -04:00
|
|
|
end
|
|
|
|
end
|
2020-08-06 09:46:17 -04:00
|
|
|
contents
|
|
|
|
end
|
|
|
|
|
2021-02-19 11:22:24 -05:00
|
|
|
def import_wcag_overrides
|
|
|
|
if @color_scheme_id && ColorScheme.find_by_id(@color_scheme_id)&.is_wcag?
|
2020-10-15 14:05:48 -04:00
|
|
|
return "@import \"wcag\";"
|
|
|
|
end
|
|
|
|
""
|
|
|
|
end
|
|
|
|
|
2021-02-19 11:22:24 -05:00
|
|
|
def color_variables
|
|
|
|
contents = +""
|
|
|
|
if @color_scheme_id
|
|
|
|
colors = begin
|
|
|
|
ColorScheme.find(@color_scheme_id).resolved_colors
|
|
|
|
rescue
|
|
|
|
ColorScheme.base_colors
|
|
|
|
end
|
2021-03-23 12:46:25 -04:00
|
|
|
elsif (@theme_id && !theme.component)
|
|
|
|
colors = theme&.color_scheme&.resolved_colors || ColorScheme.base_colors
|
2021-02-19 11:22:24 -05:00
|
|
|
else
|
2021-03-23 12:46:25 -04:00
|
|
|
# this is a slightly ugly backwards compatibility fix,
|
|
|
|
# we shouldn't be using the default theme color scheme for components
|
|
|
|
# (most components use CSS custom properties which work fine without this)
|
2021-03-17 13:34:15 -04:00
|
|
|
colors = Theme.find_by_id(SiteSetting.default_theme_id)&.color_scheme&.resolved_colors ||
|
|
|
|
ColorScheme.base_colors
|
2021-02-19 11:22:24 -05:00
|
|
|
end
|
|
|
|
|
|
|
|
colors.each do |n, hex|
|
|
|
|
contents << "$#{n}: ##{hex} !default; "
|
|
|
|
end
|
|
|
|
|
|
|
|
contents
|
|
|
|
end
|
|
|
|
|
2021-04-11 23:57:39 -04:00
|
|
|
def public_image_path
|
|
|
|
image_path = UrlHelper.absolute("#{Discourse.base_path}/images")
|
|
|
|
"$public_image_path: \"#{image_path}\"; "
|
|
|
|
end
|
|
|
|
|
2021-02-19 11:22:24 -05:00
|
|
|
def prepended_scss
|
2021-04-11 23:57:39 -04:00
|
|
|
"#{color_variables} #{public_image_path} @import \"common/foundation/variables\"; @import \"common/foundation/mixins\"; "
|
2021-02-19 11:22:24 -05:00
|
|
|
end
|
|
|
|
|
2017-04-12 10:52:52 -04:00
|
|
|
def initialize(options)
|
2017-05-09 17:20:28 -04:00
|
|
|
@theme = options[:theme]
|
2017-04-12 10:52:52 -04:00
|
|
|
@theme_id = options[:theme_id]
|
2020-08-03 22:57:10 -04:00
|
|
|
@color_scheme_id = options[:color_scheme_id]
|
|
|
|
|
2017-05-09 17:20:28 -04:00
|
|
|
if @theme && !@theme_id
|
|
|
|
# make up an id so other stuff does not bail out
|
|
|
|
@theme_id = @theme.id || -1
|
|
|
|
end
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
2021-02-02 13:09:41 -05:00
|
|
|
def theme_import(target)
|
2021-06-17 22:16:26 -04:00
|
|
|
return "" if !@theme_id
|
|
|
|
|
2021-02-02 13:09:41 -05:00
|
|
|
attr = target == :embedded_theme ? :embedded_scss : :scss
|
|
|
|
target = target.to_s.gsub("_theme", "").to_sym
|
2017-04-12 10:52:52 -04:00
|
|
|
|
2021-02-02 13:09:41 -05:00
|
|
|
contents = +""
|
|
|
|
|
|
|
|
fields = theme.list_baked_fields(target, attr)
|
2017-04-12 10:52:52 -04:00
|
|
|
fields.map do |field|
|
|
|
|
value = field.value
|
|
|
|
if value.present?
|
2021-02-02 13:09:41 -05:00
|
|
|
contents << <<~COMMENT
|
2019-04-12 06:36:08 -04:00
|
|
|
// Theme: #{field.theme.name}
|
|
|
|
// Target: #{field.target_name} #{field.name}
|
|
|
|
// Last Edited: #{field.updated_at}
|
|
|
|
COMMENT
|
2021-02-03 11:02:53 -05:00
|
|
|
|
2021-02-26 12:30:23 -05:00
|
|
|
contents << value
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
2021-02-03 11:02:53 -05:00
|
|
|
|
2021-02-02 13:09:41 -05:00
|
|
|
end
|
|
|
|
contents
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
|
|
|
def theme
|
2017-05-02 16:01:01 -04:00
|
|
|
unless @theme
|
|
|
|
@theme = (@theme_id && Theme.find(@theme_id)) || :nil
|
|
|
|
end
|
|
|
|
@theme == :nil ? nil : @theme
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
|
|
|
def category_css(category)
|
2020-09-23 12:22:07 -04:00
|
|
|
full_slug = category.full_slug.split("-")[0..-2].join("-")
|
2020-11-25 13:40:16 -05:00
|
|
|
"body.category-#{full_slug} { background-image: url(#{upload_cdn_path(category.uploaded_background.url)}) }\n"
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
|
2020-09-04 09:25:50 -04:00
|
|
|
def font_css(font)
|
|
|
|
contents = +""
|
|
|
|
|
|
|
|
if font[:variants].present?
|
2021-06-21 09:33:12 -04:00
|
|
|
fonts_dir = UrlHelper.absolute("#{Discourse.base_path}/fonts")
|
2020-09-04 09:25:50 -04:00
|
|
|
font[:variants].each do |variant|
|
2021-06-21 09:33:12 -04:00
|
|
|
src = variant[:src] ? variant[:src] : "url(\"#{fonts_dir}/#{variant[:filename]}?v=#{DiscourseFonts::VERSION}\") format(\"#{variant[:format]}\")"
|
2020-09-04 09:25:50 -04:00
|
|
|
contents << <<~EOF
|
|
|
|
@font-face {
|
|
|
|
font-family: #{font[:name]};
|
2020-09-25 09:39:14 -04:00
|
|
|
src: #{src};
|
2020-09-04 09:25:50 -04:00
|
|
|
font-weight: #{variant[:weight]};
|
|
|
|
}
|
|
|
|
EOF
|
|
|
|
end
|
|
|
|
end
|
|
|
|
|
|
|
|
contents
|
|
|
|
end
|
|
|
|
|
2017-04-12 10:52:52 -04:00
|
|
|
end
|
|
|
|
end
|