Commit Graph

111 Commits

Author SHA1 Message Date
a8667b5454 PERF: Defer setting of distributed cache in more spots.
See follow up commit for rational.

Follow-up to 8cfe203383367cc7a3cf31b3c3960b7b7aac92ef
2021-06-04 09:13:18 +08:00
8cfe203383 PERF: Defer setting of distributed cache in performance critical paths.
Setting a key/value pair in DistributedCache involves waiting on the
write to Redis to finish. In most cases, we don't need to wait on the
setting of the cache to finish. We just need to take our return value
and move on.
2021-06-03 09:30:52 +08:00
6a79864f14 PERF: Cache categories query in Stylesheet::Manager.color_scheme_digest.
The query is being executed each time we try and generate the link path
for a stylesheet within the duration of a reqeust. Categories are not
updated that often so repeating this query multiple times a request is
wasteful.

At the time of this commit, there is a `publish_discourse_stylesheet`
ActiveRecord callback on the `Category` model which clears the cache of
`Stylesheet::Manager` each time a category is saved.
2021-06-02 13:33:31 +08:00
958b56dc6c PERF: Precompile child theme stylesheets. (#13040)
Previously, we only precompiled the CSS for parent themes but not for
the child themes. As a result, the CSS for child themes were being
compiled during the first request which made the respond time high for
that request.
2021-05-20 16:01:54 +10:00
7568c7a101 PERF: Make stylesheet max_file_mtime calculation more efficient (#12876)
Plugins always store their stylesheets under `/assets/stylesheets`, so we can make the glob pattern much more specific. In my local development environment, this increases the speed of `Stylesheet::Manager.max_file_mtime` from ~65ms to ~3ms (20x faster). This significantly improves stylesheet regeneration time, and the responsiveness of the theme admin UI.

Note that this will have negligible effect in production, because in production the value of `max_file_mtime` is aggressively cached.
2021-04-28 17:27:18 +01:00
1fd8f6df5f PERF: Improve theme stylesheet compilation performance (#12850)
When building the `scss_load_paths`, we were creating a full export of the theme (including uploads), and not cleaning it up. With many uploads, this can be extremely slow (because it downloads every upload from S3), and the lack of cleanup could cause a disk to fill up over time.

This commit updates the ZipExporter to provide a `with_export_dir` API, which takes care of cleanup. It also adds a kwarg which allows exporting only extra_scss fields. This should make things much faster for themes with many uploads.
2021-04-27 14:33:43 +01:00
3157d5ee1b DEV: ensures stylesheet watcher isn't crashing with gems plugins (#12733)
* DEV: ensures stylesheet watcher isn't crashing with gems plugins

This bug has been exhibited since discourse_dev is now including an auth plugin which was loaded as a relative path instead of an absolute path, eg:

`Users/bob/.gem/ruby/2.6.6/gems/discourse_dev-0.1.0/auth/plugin.rb`

Instead of

`/Users/bob/.gem/ruby/2.6.6/gems/discourse_dev-0.1.0/auth/plugin.rb`
2021-04-16 15:25:20 +02:00
abb0a4bae2 DEV: Add SCSS helper to replace asset-uri and image-uri (#12664) 2021-04-12 13:57:39 +10:00
066c59d0e3 FIX: Regression in colors used by non-default theme (#12492)
eb7f0ec caused this regression, where a non-default theme set to use
the base color scheme was resolving to the default theme's color scheme.
2021-03-23 12:46:25 -04:00
eb7f0ec766 FIX: In components, fall back to default theme color variables (#12423)
Component SCSS compilation should use the current theme's SCSS color
variables as a fallback before using the default core colors.

This is mostly a backwards-compatibility fix, new themes and components
should use CSS custom properties, which offer better support for on-the-fly
color scheme changes (dark mode support, etc.).
2021-03-17 13:34:15 -04:00
de05c410c5 DEV: Use fewer threads when watching for SCSS changes (#12393) 2021-03-12 16:18:00 -05:00
52d833472c DEV: Refactor plugin SCSS compilation (#12359) 2021-03-12 11:17:42 -05:00
4071af1d09 DEV: Refactor font and category background importers (#12312) 2021-03-10 11:05:56 -05:00
cf0192018e FIX: Do not output empty style tags for components (#12229) 2021-03-01 09:14:25 -05:00
aa1442fdc3 DEV: Use separate files for theme component stylesheets (take 2) (#12225)
This switches to outputting a separate file for each theme component CSS
asset. We have separate CSS plugin files, separate JS files
(for plugins/themes/components), it makes sense to do the same for
component CSS assets.

Benefits:
- easier debugging
- fixes a regression with theme component sourcemaps
- changes to theme components are updated individually

With HTTP/2, there is also no performance downside to having additional
files in the initial request.
2021-02-26 12:30:23 -05:00
e74bdfdf8e Revert "DEV: Use separate files for theme component stylesheets (#12214)" (#12224)
This reverts commit f57a49c2f97c78865a4ad806339a2f847d6bc98c.

This had some unexpected side effects, needs some more work.
2021-02-26 08:20:39 -05:00
f57a49c2f9 DEV: Use separate files for theme component stylesheets (#12214)
This switches to outputting a separate file for each theme component CSS
asset. We have separate CSS plugin files, separate JS files
(for plugins/themes/components), it makes sense to do the same for
component CSS assets.

Benefits:
- easier debugging
- fixes a regression with theme component sourcemaps
- changes to theme components are updated individually

With HTTP/2, there is also no performance downside to having additional
files in the initial request.
2021-02-26 07:44:15 -05:00
c0fd4ab9d6 DEV: Remove deprecated plugins variables importer (#12168) 2021-02-23 16:20:59 -05:00
5604ce70d4 DEV: More refactoring of SCSS importers (#12143) 2021-02-19 11:22:24 -05:00
12ffba771c FIX: Improve SCSS handling in components (#11963)
- ignores errors when including component SCSS in parent theme
- adds support for SCSS `@import`s in components' `color_definitions.scss` files
2021-02-04 08:51:18 -05:00
2309032e68 FIX: Include extra SCSS in child theme (#11952) 2021-02-03 11:02:53 -05:00
e8b82724fd DEV: Refactor theme SCSS compilation (#11919) 2021-02-02 13:09:41 -05:00
5f846531a5 DEV: Cleanup variables/mixins SCSS imports (#11618)
Prepends variables.scss and mixins.scss globally for all assets. With
one notable exception, theme fields, which will be addressed in a
separate PR.
2021-01-05 14:05:34 -05:00
303f229e98 DEV: Use indexes when importing SCSS from a folder (#11591)
By default, SCSS does not support globbing. This removes our magic and uses index files to import all files in a folder.
2020-12-30 15:29:10 -05:00
c9df679ba1 FIX: Only use full slugs when compiling category backgrounds. (#11353)
If a category and a sub-category have the same slug, adding a background to one of them will also show it on the other one. This was introduced in 8e3f667 to fix a discrepancy, which was later fixed in 214b4c3.
2020-11-25 15:40:16 -03:00
8be55184e6 FIX: Precompile wizard stylesheet (#11275)
This ensures it will not raise a 404 error during deploys
2020-11-18 09:36:52 +00:00
5d480257d4 FIX: Precompile all plugin and color definition CSS assets (#11210) 2020-11-12 10:17:38 +11:00
5763309953 FEATURE: WCAG compliant color schemes (#10882)
Co-authored-by: Kris <kris.aubuchon@discourse.org>
2020-10-15 14:05:48 -04:00
a4356b99af FEATURE: Separate base and heading font site_settings (#10807)
Allows site administrators to pick different fonts for headings in the wizard and in their site settings. Also correctly displays the header logos in wizard previews.
2020-10-05 13:40:41 -04:00
b1692422b1 FEATURE: Support using system font in wizard font step (#10742)
Co-authored-by: Bianca Nenciu <nbianca@users.noreply.github.com>
2020-09-25 09:39:14 -04:00
214b4c3910 FIX: Remove category id from category class name (#10712)
The generated class name included ID (parent_slug-child_slug-child_id),
but the client side did not expect it (parent_slug-child_slug).
2020-09-23 19:22:07 +03:00
eb891778ff DEV: Do not translate font names (#10723)
Use the names as provided by discourse-fonts and remove the
translated strings.

It also ensures that the selected font is present in case a font will
be removed in the future.
2020-09-23 12:00:07 +03:00
6610576deb FIX: Clear stylesheet cache on base font change
Previously, we were not clearing the cache on themes using the default
color scheme.
2020-09-15 13:13:09 -04:00
b409954398 DEV: Improve theme support for color definitions (#10634)
- Lets child components extend color definitions
- Includes default theme color definitions
- Fails gracefully on color stylesheet SCSS errors
- Includes theme variables when extending colors
2020-09-09 11:43:34 -04:00
d4a7058cb1 DEV: Strip unicode from color scheme stylesheet filenames (#10628) 2020-09-08 15:00:16 -04:00
e73ff68f75 FEATURE: Add css classes to stylesheet link elements (#10598)
Adding these classes to the stylesheet link elements in order to toggle dark/light schemes via this theme-component. Eventually this theme-component could possible be merged into core.
2020-09-04 15:40:40 -05:00
58b97ace23 DEV: Use a special import to declare font faces (#10583)
Update discourse-fonts to v0.0.3.

Follow-up to 7b7357147e458c5c4b268a3ae9a8d40515fb526d.
2020-09-04 16:25:50 +03:00
899b841554 DEV: Faster SCSS refresh locally for plugins
Only updates the targeted stylesheet when available
2020-09-01 13:56:40 -04:00
882b0aac19 DEV: Let themes extend color definitions (#10429)
Themes can now declare custom colors that get compiled in core's color definitions stylesheet, thus allowing themes to better support dark/light color schemes. 

For example, if you need your theme to use tertiary for an element in a light color scheme and quaternary in a dark scheme, you can add the following SCSS to your theme's `color_definitions.scss` file: 

```
:root {
  --mytheme-tertiary-or-quaternary: #{dark-light-choose($tertiary, $quaternary)};
}
```

And then use the `--mytheme-tertiary-or-quaternary` variable as the color property of that element. You can also use this file to add color variables that use SCSS color transformation functions (lighten, darken, saturate, etc.) without compromising your theme's compatibility with different color schemes.
2020-08-18 13:02:13 -04:00
6dd9f2eca2 FIX: color scheme selection with non-default theme
This fixes an issue where a non-default theme set to use the base color
scheme (i.e. the theme had an empty `color_scheme_id`) was loading the
default theme's color scheme instead.
2020-08-12 08:49:13 -04:00
c05aced094 FIX: Invalidate cache when updating color scheme colors (#10417) 2020-08-11 16:28:59 -04:00
f179510a68 FIX: include both name and id in color scheme stylesheet filename slugs (#10397) 2020-08-07 13:43:45 -04:00
76c02cac65 DEV: Ensure the correct plugin stylesheets are reloaded in development
If a plugin name contained the name of another plugin, the wrong stylesheets would be reloaded. For example, working on discourse-prometheus-alert-receiver would cause discourse-prometheus stylesheets to be reloaded.
2020-08-06 16:10:57 +01:00
87e2c9de24 DEV: Plugins can extend color definitions (#10383) 2020-08-06 09:46:17 -04:00
6fdc711b4a FEATURE: Allow users to opt out of automatic dark mode (#10377) 2020-08-06 09:45:37 -04:00
d0953dcda9 DEV: Fix watching plugin stylesheet changes locally
I broke this in e6dbb4fcf52fa74853ed45616dd7cbf620c7deca
2020-08-04 14:10:25 -04:00
266c0c50d7 FIX: Load base color scheme when default theme is not set
Followup to c937afc
2020-08-04 12:15:07 -04:00
c937afc75e FEATURE: automatic dark mode (#10341)
A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. 

This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting.
2020-08-03 22:57:10 -04:00
e6dbb4fcf5 DEV: Live refresh all themes when watching stylesheets (#10337) 2020-07-30 19:03:24 -04:00
8e3f667d7c FIX: Show background images for both slug formats
It seems there was a discrepancy in that background images were attached
to the full slug category class: `category-:slug-:id` and our body class
only had `category-:slug`.

This fix adds support for both formats.
2020-07-17 13:42:30 -04:00