@tailwindcss/aspect-ratio - npm Package Compare versions

Comparing version 0.2.1 to 0.2.2

CHANGELOG.md

		@@ -12,2 +12,8 @@ # Changelog

		## [0.2.1] - 2021-05-24

		### Fixed

		- Mark `tailwindcss` as peer-dependency for better monorepo support ([#14](https://github.com/tailwindlabs/tailwindcss-aspect-ratio/pull/14))

		## [0.2.0] - 2020-11-16
		@@ -47,3 +53,4 @@

		[unreleased]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.2.0...HEAD
		[unreleased]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.2.1...HEAD
		[0.2.1]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.2.0...v0.2.1
		[0.2.0]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.1.4...v0.2.0
		@@ -50,0 +57,0 @@ [0.1.4]: https://github.com/tailwindlabs/tailwindcss-aspect-ratio/compare/v0.1.3...v0.1.4

package.json

		{
		"name": "@tailwindcss/aspect-ratio",
		"version": "0.2.1",
		"version": "0.2.2",
		"main": "src/index.js",
		@@ -20,3 +20,3 @@ "license": "MIT",
		"peerDependencies": {
		"tailwindcss": ">=2.0.0"
		"tailwindcss": ">=2.0.0 \|\| >=3.0.0-alpha.1"
		},
		@@ -23,0 +23,0 @@ "devDependencies": {

README.md

		@@ -51,3 +51,10 @@ # @tailwindcss/aspect-ratio

		When removing aspect ratio behavior, if nested elements have `w-{n}` or `h-{n}` classes, ensure they are re-declared with a matching breakpoint prefix:

		```html
		<div class="aspect-w-16 aspect-h-9 lg:aspect-none">
		<img src="..." alt="..." class="w-full h-full object-center object-cover lg:w-full lg:h-full" />
		</div>
		```

		Note that due to the way this currently needs to be implemented ([the old padding-bottom trick](https://css-tricks.com/aspect-ratio-boxes/)) you need to assign the aspect ratio to a _parent_ element, and make the actual element you are trying to size the only child of that parent.
		@@ -54,0 +61,0 @@

New alerts