change Sass configuaration #205
Conversation
|
View diff of compiled files (may take a few minutes): https://github.com/oddbird/oddleventy-built/compare/main..sass-config |
|
@mirisuzanne @stacyk This is mostly changing the way we load Accoutrement in our files, similar to what we in Time Designer. In the Styleguide, I'm wondering how you two feel about the ordering. Is there a way to specify when each item appears if we want the order to be Color Config --> Brand Colors -->> Background Colors . . .etc in a similar order to the current styleguide? I haven't split |
I don't think there's any explicit way to set the order of a page. The options would be splitting things into separate pages, or ensuring they have the order we want in the Sass itself. (Sassdoc/herman builds the page in the order things are written in the Sass) |
| /// @access private | ||
| /// @group config-color | ||
| $_hues: ( | ||
| 'prime': math.div(color.hue(brand.$brand-blue), 1deg), |
There was a problem hiding this comment.
Filed an issue to make it so we don't have to do this unit math: oddbird/cascading-color-system#26
There was a problem hiding this comment.
@mirisuzanne I made some changes to address your review and make this project more inline with how we have OddBooks structured. I believe we have to use CSS variables for some of the CCS stuff to work, and Herman doesn't have access to the definitions of those colors right? I added and removed and re-added the
@include herman.add(
'colors',
'x-colors',
tools.compile-colors(meta.module-variables('all-other-color-files'))
);
for all the content, background, and ccs default color files (brand uses color values to define the colors instead of custom properties so those are fine). I know the maps would display the color name and value before this change even though it didn't show a preview. If I add that block above for each color file, the colors will show up like a preview, list the color name and the variable value... but all of them are empty. Is there a way load the styleguide.css file like it does when you use an example like the focus-ring styleguide page? https://www.oddbird.net/styleguide/config-focus
* main: (26 commits) Remove markdown from u-url links fix sample filters Upgrade deps Click to copy header anchor links (#206) Address review fix tag Fix confusing u-url, and add explicit syndication links Update content/blog/2022/shared-elements.md Hero image and todays date Review for clarity review Missing files Draft page-transitions blog post review Address review comments merge duplication & blocklist filters simplify map of syndications prefer feed over cache in case of duplicates latest node-fetch fix macros ...
* main: Delete snyk.yml
* main: remove ELEVENTY_ENV env var remove duplicate quotes on Metecho and MetaDeploy Test if context is readable discreet -> discrete removed word 'modern' from in front of CSS/Sass Update content/blog/2022/zero-units.md Link to stylelint option Address review comments on zero-units review Hero image and edits for zero-units review review added david reed and brandon parker quotes to Metecho and Metadeploy Replace Google Analytics with Plausible Initial draft of zero-units blog post
| /// | ||
| /// @each $name, $color in tools.compile-colors(meta.module-variables('content')) { | ||
| /// /*! #{$name}: #{$color}; */ | ||
| /// } | ||
| @include herman.add( | ||
| 'colors', | ||
| 'content-colors', |
There was a problem hiding this comment.
@mirisuzanne doesn't this content-colors here reference the /// @colors content-colors line that we no longer have from the src/scss/config/color/_content.scss file?
There was a problem hiding this comment.
uh, yes, I guess so - that line is adding the colors to Herman, even though (for now) we're not displaying them with Herman. So it's not doing anything useful, but also not causing any issues. We could remove that herman.add for now, or just leave it so it works once we add custom property support to Herman? Either way.
There was a problem hiding this comment.
OK, I'd say we can leave it there for now since it doesn't hurt anything and maybe if/when we update Herman we will be in good shape.
There was a problem hiding this comment.
ok @mirisuzanne @jgerigmeyer this has all the colors showing values instead of the blank previews (although the /*! is a bit messy but I think that is so it doesn't error). This will work until we have a better fix in place for Herman.
The ordering of things on this page doesn't bother me too much but I think it we want a certain order (like having the h1 at the top) we need different pages and I think I prefer them all one one page more than my desire to reorder at this time.
|
@stacyk The |
…nto sass-config # Conflicts: # src/mentions/webmentions.json
OK, I updated the comment (removed the |
Steps to test/reproduce
toolsorconfig/cascading-colors/and[data-ccs-colors]to make sure everything is loading as it shouldPlease explain how to best reproduce the issue and/or test the changes locally (including the pages/URLs/views/states to review).
Show me
Provide screenshots/animated gifs/videos if necessary.
REMEMBER: Attach this PR to the Trello card