From e894ecf6f8090ec80682fd04f1952736c152566b Mon Sep 17 00:00:00 2001 From: Bart Veneman Date: Sun, 18 Feb 2024 23:18:40 +0100 Subject: [PATCH 1/3] update readme example code --- README.md | 26 +++++++++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 8e11069..82f0989 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,31 @@ Fast, small, zero-config library to format CSS with basic [rules](#formatting-ru ## Example output -![Example input-output of this formatter](https://github.com/projectwallace/format-css/assets/1536852/ce160fd3-fa11-4d90-9432-22567ee1d851) + +```css +/* TURN THIS: */ + +@layer base.normalize{@media (dynamic-range:high) or (color-gamut:p3){@supports (color:color(display-p3 0 0 0)){:where(html){--link:color(display-p3 .1 .4 1);--link-visited:color(display-p3 .6 .2 1)}}}}@layer base.normalize{:where(html) :where(dialog){background-color:var(--surface-1)}} + +/* INTO THIS: */ + +@layer base.normalize { + @media (dynamic-range: high) or (color-gamut: p3) { + @supports (color: color(display-p3 0 0 0)) { + :where(html) { + --link: color(display-p3 .1 .4 1); + --link-visited: color(display-p3 .6 .2 1); + } + } + } +} + +@layer base.normalize { + :where(html) :where(dialog) { + background-color: var(--surface-1); + } +} +``` ## Installation From 85ea33678f3ad7ac7d53787918fcdbf8a19168f2 Mon Sep 17 00:00:00 2001 From: Bart Veneman Date: Sun, 18 Feb 2024 23:21:48 +0100 Subject: [PATCH 2/3] code upd --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 82f0989..5cd468a 100644 --- a/README.md +++ b/README.md @@ -28,6 +28,8 @@ Fast, small, zero-config library to format CSS with basic [rules](#formatting-ru background-color: var(--surface-1); } } + +/* AND BACK AGAIN! */ ``` ## Installation From 613f5f38781b3d3c805f2e697d7d8d900c6b7638 Mon Sep 17 00:00:00 2001 From: Bart Veneman Date: Sun, 18 Feb 2024 23:24:11 +0100 Subject: [PATCH 3/3] update related projects --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 5cd468a..226a6ad 100644 --- a/README.md +++ b/README.md @@ -85,6 +85,6 @@ let formatted_mini = format("a {}", { minify: true }); ## Related projects -- [Format CSS online](https://www.projectwallace.com/prettify-css?utm_source=github&utm_medium=wallace_format_css_related_projects) - See this minifier in action online! +- [Format CSS online](https://www.projectwallace.com/prettify-css?utm_source=github&utm_medium=wallace_format_css_related_projects) - See this formatter in action online! +- [Minify CSS online](https://www.projectwallace.com/minify-css?utm_source=github&utm_medium=wallace_format_css_related_projects) - See this minifier in action online! - [CSS Analyzer](https://github.com/projectwallace/css-analyzer) - The best CSS analyzer that powers all analysis on [projectwallace.com](https://www.projectwallace.com?utm_source=github&utm_medium=wallace_format_css_related_projects) -- [Minify CSS](https://github.com/projectwallace/minify-css) The exact opposite of this library: fast, small, zero-config CSS minifier.