unocss 0.43.0 → 0.44.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +25 -10
  2. package/package.json +18 -18
package/README.md CHANGED
@@ -45,13 +45,13 @@ Inspired by [Windi CSS](http://windicss.org/), [Tailwind CSS](https://tailwindcs
45
45
  ###### Benchmark
46
46
 
47
47
  ```
48
- 3/26/2022, 11:41:26 PM
48
+ 2022/7/2 08:38:12 PM
49
49
  1656 utilities | x50 runs (min build time)
50
50
 
51
- none 12.42 ms / delta. 0.00 ms
52
- unocss v0.30.6 20.98 ms / delta. 8.57 ms (x1.00)
53
- tailwindcss v3.0.23 1621.38 ms / delta. 1608.96 ms (x187.79)
54
- windicss v3.5.1 1855.86 ms / delta. 1843.45 ms (x215.16)
51
+ none 5.87 ms / delta. 0.00 ms
52
+ unocss v0.43.0 9.17 ms / delta. 3.30 ms (x1.00)
53
+ tailwindcss v3.1.4 497.24 ms / delta. 491.37 ms (x148.70)
54
+ windicss v3.5.5 869.47 ms / delta. 863.60 ms (x261.35)
55
55
  ```
56
56
 
57
57
  ## Installation
@@ -468,16 +468,13 @@ UnoCSS also supports the theming system that you might be familiar with in Tailw
468
468
 
469
469
  ```ts
470
470
  theme: {
471
+ // ...
471
472
  colors: {
472
473
  'veryCool': '#0000ff', // class="text-very-cool"
473
474
  'brand': {
474
475
  'primary': 'hsla(var(--hue, 217), 78%, 51%)', //class="bg-brand-primary"
475
476
  }
476
477
  },
477
- breakpoints: {
478
- xs: '320px',
479
- sm: '640px',
480
- }
481
478
  }
482
479
  ```
483
480
 
@@ -492,6 +489,24 @@ rules: [
492
489
  ]
493
490
  ```
494
491
 
492
+ One exception is that UnoCSS gives full control of `breakpoints` to users. When a custom `breakpoints` is provided, the default will be overridden instead of merging. For example:
493
+
494
+ <!--eslint-skip-->
495
+
496
+ ```ts
497
+ theme: {
498
+ // ...
499
+ breakpoints: {
500
+ sm: '320px',
501
+ md: '640px',
502
+ },
503
+ }
504
+ ```
505
+
506
+ Right now, you can only use the `sm:` and `md:` breakpoint variants.
507
+
508
+ `verticalBreakpoints` is same as `breakpoints` but for vertical layout.
509
+
495
510
  ### Layers
496
511
 
497
512
  The order of CSS will affect their priorities. While we will [retain the order of rules](#ordering), sometimes you may want to group some utilities to have more explicit control of their order.
@@ -579,7 +594,7 @@ By default UnoCSS will scan for components files like: `.jsx`, `.tsx`, `.vue`, `
579
594
  Sometimes you might want have to use dynamic concatenations like:
580
595
 
581
596
  ```html
582
- <div class="p-${size}"></div>
597
+ <div class="p-${size}"></div> <!-- this won't work! -->
583
598
  ```
584
599
 
585
600
  Due the fact that UnoCSS works in build time using static extracting, at the compile time we can't possibility know all the combination of the utilities. For that, you can configure the `safelist` option.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "unocss",
3
- "version": "0.43.0",
3
+ "version": "0.44.0",
4
4
  "description": "The instant on-demand Atomic CSS engine.",
5
5
  "author": "Anthony Fu <anthonyfu117@hotmail.com>",
6
6
  "license": "MIT",
@@ -93,7 +93,7 @@
93
93
  "node": ">=14"
94
94
  },
95
95
  "peerDependencies": {
96
- "@unocss/webpack": "0.43.0"
96
+ "@unocss/webpack": "0.44.0"
97
97
  },
98
98
  "peerDependenciesMeta": {
99
99
  "@unocss/webpack": {
@@ -101,24 +101,24 @@
101
101
  }
102
102
  },
103
103
  "dependencies": {
104
- "@unocss/cli": "0.43.0",
105
- "@unocss/core": "0.43.0",
106
- "@unocss/preset-attributify": "0.43.0",
107
- "@unocss/preset-icons": "0.43.0",
108
- "@unocss/preset-mini": "0.43.0",
109
- "@unocss/preset-tagify": "0.43.0",
110
- "@unocss/preset-typography": "0.43.0",
111
- "@unocss/preset-uno": "0.43.0",
112
- "@unocss/preset-web-fonts": "0.43.0",
113
- "@unocss/preset-wind": "0.43.0",
114
- "@unocss/reset": "0.43.0",
115
- "@unocss/transformer-compile-class": "0.43.0",
116
- "@unocss/transformer-directives": "0.43.0",
117
- "@unocss/transformer-variant-group": "0.43.0",
118
- "@unocss/vite": "0.43.0"
104
+ "@unocss/cli": "0.44.0",
105
+ "@unocss/core": "0.44.0",
106
+ "@unocss/preset-attributify": "0.44.0",
107
+ "@unocss/preset-icons": "0.44.0",
108
+ "@unocss/preset-mini": "0.44.0",
109
+ "@unocss/preset-tagify": "0.44.0",
110
+ "@unocss/preset-typography": "0.44.0",
111
+ "@unocss/preset-uno": "0.44.0",
112
+ "@unocss/preset-web-fonts": "0.44.0",
113
+ "@unocss/preset-wind": "0.44.0",
114
+ "@unocss/reset": "0.44.0",
115
+ "@unocss/transformer-compile-class": "0.44.0",
116
+ "@unocss/transformer-directives": "0.44.0",
117
+ "@unocss/transformer-variant-group": "0.44.0",
118
+ "@unocss/vite": "0.44.0"
119
119
  },
120
120
  "devDependencies": {
121
- "@unocss/webpack": "0.43.0"
121
+ "@unocss/webpack": "0.44.0"
122
122
  },
123
123
  "scripts": {
124
124
  "build": "unbuild",