web 3d图形渲染器
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

84 lines
1.5 KiB

  1. # CSS Modules: Values
  2. Pass arbitrary values between your module files
  3. ### Usage
  4. ```css
  5. /* colors.css */
  6. @value primary: #BF4040;
  7. @value secondary: #1F4F7F;
  8. .text-primary {
  9. color: primary;
  10. }
  11. .text-secondary {
  12. color: secondary;
  13. }
  14. ```
  15. ```css
  16. /* breakpoints.css */
  17. @value small: (max-width: 599px);
  18. @value medium: (min-width: 600px) and (max-width: 959px);
  19. @value large: (min-width: 960px);
  20. ```
  21. ```css
  22. /* my-component.css */
  23. /* alias paths for other values or composition */
  24. @value colors: "./colors.css";
  25. /* import multiple from a single file */
  26. @value primary, secondary from colors;
  27. /* make local aliases to imported values */
  28. @value small as bp-small, large as bp-large from "./breakpoints.css";
  29. /* value as selector name */
  30. @value selectorValue: secondary-color;
  31. .selectorValue {
  32. color: secondary;
  33. }
  34. .header {
  35. composes: text-primary from colors;
  36. box-shadow: 0 0 10px secondary;
  37. }
  38. @media bp-small {
  39. .header {
  40. box-shadow: 0 0 4px secondary;
  41. }
  42. }
  43. @media bp-large {
  44. .header {
  45. box-shadow: 0 0 20px secondary;
  46. }
  47. }
  48. ```
  49. **If you are using Sass** along with this PostCSS plugin, do not use the colon `:` in your `@value` definitions. It will cause Sass to crash.
  50. Note also you can _import_ multiple values at once but can only _define_ one value per line.
  51. ```css
  52. @value a: b, c: d; /* defines a as "b, c: d" */
  53. ```
  54. ### Justification
  55. See [this PR](https://github.com/css-modules/css-modules-loader-core/pull/28) for more background
  56. ## License
  57. ISC
  58. ## With thanks
  59. - Mark Dalgleish
  60. - Tobias Koppers
  61. - Josh Johnston
  62. ---
  63. Glen Maddern, 2015.