Support sass files in pegasus/sites.v3/code.org/public/css - #46896
Conversation
1261474 to
565ffbb
Compare
jamescodeorg
changed the title
There was a problem hiding this comment.
Does putting the .scss files in pegasus/sites.v3/code.org/public/css alongside regular css files sound good? Or should we put them in a separate directory?
There was a problem hiding this comment.
I think for easier access they can live alongside .css files in the /public/css directory. Happy to defer to the others though.
565ffbb to
d78e17a
Compare
| # Note: shared_resources.rb has additional configuration for Sass::Plugin | ||
| Sass::Plugin.options[:cache_location] = pegasus_dir('cache', '.sass-cache') | ||
| Sass::Plugin.options[:css_location] = pegasus_dir('cache', 'css') | ||
| Sass::Plugin.options[:template_location] = shared_dir('css') |
There was a problem hiding this comment.
Removed this redundant configuration for /shared/css in Pegasus.
There was a problem hiding this comment.
Could you provide a bit more context on why this is redundant and what these options represent?
There was a problem hiding this comment.
The "official" documentation appears to be no longer available, but here's a fork: http://paulirish.github.io/Sass-reference/. Very briefly, what the gem does is looks for sass files in css_location, compiles them, and writes the output to template_location. I've replaced the existing way of configuration them in options (which allows for a single mapping) to calling add_template_location which allows for configuring multiple mappings.
We used to configure this particular mapping (pegasus/cache/css --> shared/css) redundantly in pegasus and in shared, possibly because of some pegasus tests issues. This mapping is now only configured in shared_resources.rb and the new pegasus-specific sass directory mapping is configured here. I've attempted to fix the test issue a different way (see change in test_pegasus_documents.rb) and will keep an eye if that's sufficient.
maureensturgeon
left a comment
maureensturgeon
left a comment
There was a problem hiding this comment.
How did you go about testing the changes here?
| configure do | ||
| # Note 1: pegasus/router.rb has additional configuration for Sass::Plugin | ||
| # Note 2: the generated css files written to /pegasus/cache/css are served | ||
| # from the url path /shared/css (see route below) |
There was a problem hiding this comment.
when I add a .scss file pegasus/sites.v3/code.org/public/css/dave.scss, then restart the local server and load a pegasus page, I see a .css file show up in pegasus/sites.v3/code.org/public/css/generated/dave.css. so far so good. However now I am wondering, how does pegasus/cache/css come into play? also, what url path would I use to access my new css file?
There was a problem hiding this comment.
The cache stores some kind of internal intermediate parsed version of the .scss file (with an extension of .scssc). The official documentation is no longer available, but I found a copy and there's a little bit more information about caching here.
The new css file can be accessed at code.org/css/generated/dave.css.
Good question! :-) I used Kelby's test html and scss files locally and verified that the html rendered as expected. I'm relying on Drone to verify that the change to the tests works. Finally, I'm expecting the eyes tests to provide broader coverage across the site to make sure I haven't broken anything. |
davidsbailey
left a comment
davidsbailey
left a comment
There was a problem hiding this comment.
all makes sense, thank you James!
|
This is great! |
5 participants
.scss files placed in the existing
pegasus/sites.v3/code.org/public/cssdirectory will now be automatically compiled to .css files and can be retrieved from the url path/css/generatedNote that this uses our existing pattern that relies on the sass gem which is past end-of-life.Links
/shared/cssTesting story
Deployment strategy
Follow-up work
Privacy
Security
Caching
PR Checklist: