From 088184321e8bfe6d10846b185142b196d94f2647 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matthias=20M=C3=BCller?= Date: Wed, 18 May 2016 01:20:08 +0200 Subject: [PATCH] add overflow-wrap fallback --- docs/content/features.md | 14 ++++++++++++++ docs/content/index.md | 6 ++++++ docs/content/playground.html | 5 +++++ package.json | 1 + .../fixtures/features/replace-overflow-wrap.css | 3 +++ .../features/replace-overflow-wrap.expected.css | 3 +++ src/features.js | 3 +++ 7 files changed, 35 insertions(+) create mode 100644 src/__tests__/fixtures/features/replace-overflow-wrap.css create mode 100644 src/__tests__/fixtures/features/replace-overflow-wrap.expected.css diff --git a/docs/content/features.md b/docs/content/features.md index e30a45e..6dc33a5 100644 --- a/docs/content/features.md +++ b/docs/content/features.md @@ -392,6 +392,20 @@ a::before { | [Plugin documentation](https://github.com/axa-ch/postcss-pseudoelements) +## `overflow-wrap` property (`word-wrap` fallback) + +Converts `overflow-wrap` to `word-wrap` (many browser support only the old [word-wrap](http://caniuse.com/#feat=wordwrap) property). + +```css +body { + overflow-wrap: break-word; +} +``` + +[Specification](https://drafts.csswg.org/css-text-3/#propdef-word-wrap) +| +[Plugin documentation](https://github.com/MattDiMu/postcss-replace-overflow-wrap) + ## @todo Any omissions of the CSS specifications (even in draft) that are subject to be diff --git a/docs/content/index.md b/docs/content/index.md index c6a4132..513859d 100644 --- a/docs/content/index.md +++ b/docs/content/index.md @@ -126,6 +126,12 @@ title: cssnext - Use tomorrow’s CSS syntax, today. (: fallback) +

+ overflow-wrap property + + (word-wrap fallback) + +

diff --git a/package.json b/package.json index a6b13a1..1c47f46 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "postcss-nesting": "^2.0.5", "postcss-pseudo-class-any-link": "^1.0.0", "postcss-pseudoelements": "^3.0.0", + "postcss-replace-overflow-wrap": "^1.0.0", "postcss-selector-matches": "^2.0.0", "postcss-selector-not": "^2.0.0" }, diff --git a/src/__tests__/fixtures/features/replace-overflow-wrap.css b/src/__tests__/fixtures/features/replace-overflow-wrap.css new file mode 100644 index 0000000..faaa52d --- /dev/null +++ b/src/__tests__/fixtures/features/replace-overflow-wrap.css @@ -0,0 +1,3 @@ +body { + overflow-wrap: break-word; +} diff --git a/src/__tests__/fixtures/features/replace-overflow-wrap.expected.css b/src/__tests__/fixtures/features/replace-overflow-wrap.expected.css new file mode 100644 index 0000000..bc3bb48 --- /dev/null +++ b/src/__tests__/fixtures/features/replace-overflow-wrap.expected.css @@ -0,0 +1,3 @@ +body { + word-wrap: break-word; +} diff --git a/src/features.js b/src/features.js index ca3b0d4..b47c4b9 100644 --- a/src/features.js +++ b/src/features.js @@ -66,6 +66,9 @@ export default { // https://npmjs.com/package/postcss-color-rgba-fallback colorRgba: (options) => require("postcss-color-rgba-fallback")(options), + // https://www.npmjs.com/package/postcss-replace-overflow-wrap + replaceOverflowWrap: (options) => require("postcss-replace-overflow-wrap")(options), + // https://npmjs.com/package/autoprefixer autoprefixer: (options) => require("autoprefixer")(options), }