canonical / canonical/vanilla-framework
Move example-specific styling out of framework SCSS
- Dominant language
- HTML
- Stars
- 983
- Forks
- 216
- Avg merge
- 3d 13h
- Merged PRs (30d)
- 3
Description
Currently we have some example-specific styling (for grids, layouts) in framework SCSS (`.grid-demo` `.app-demo`) and sometimes inline in example HTML (making it visible in CodePen).
We should find a better solution for where to keep them, so they are separate from the Vanilla framework codebase, are not visible in HTML code in CodePens, but are still useful and possibly have access to SCSS variables.
One possible solution would be to create a `example.scss` stylesheet, built to separate `example.css` (outside of Vanilla `build.css`).
Related: discussion on application layout review: https://github.com/canonical-web-and-design/vanilla-framework/pull/3175#discussion_r466469614
Contributor guide
Research direction
Review the framework SCSS selectors `.grid-demo` and `.app-demo`, their inline counterparts in example HTML, and the application layout discussion in pull request #3175. The work is complete when example styles are separate from Vanilla's framework build, absent from CodePen HTML, and can still use SCSS variables.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, html, sass, scss
- Domain
- build-system, frontend
- Issue type
- Refactor
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100