Skip to content

Instantly share code, notes, and snippets.

@strarsis
Last active April 20, 2020 14:48
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save strarsis/71143c72942bc8211191fec9d12286bb to your computer and use it in GitHub Desktop.
Save strarsis/71143c72942bc8211191fec9d12286bb to your computer and use it in GitHub Desktop.
test.css
module.exports = {
map: {
inline: false,
},
plugins: [
require('postcss-css-variables'),
],
}
/* (postcss-cli) postcss test.postcss.css --output out/test.out.css */
.editor-styles-wrapper {
background: grey;
}
.wp-block-group {
background-image: url("data:image/svg+xml,%3Csvg%3E.b%7Bclip-path:url(test);%7D%3C/svg%3E");
color: red !important;
}
body {
color: blue;
}
body:not(.some-class) {
font-style: italic;
}
body h1 {
color: red;
}
body p {
color: yellow;
}
html h1 {
text-decoration: underline;
}
/*# sourceMappingURL=test.out.css.map */
{"version":3,"sources":["test.postcss.css"],"names":[],"mappings":"AAAA,qEAAqE;;AAMrE;EACE,gBAAgB;AAClB;;AAEA;EACE,2FAA2F;EAC3F,qBAAqB;AACvB;;AAEA;EACE,WAAuB;AACzB;;AAEA;EACE,kBAAkB;AACpB;;;AAGA;EACE,UAAU;AACZ;;AAEA;EACE,aAAa;AACf;;AAEA;EACE,0BAA0B;AAC5B","file":"test.out.css","sourcesContent":["/* (postcss-cli) postcss test.postcss.css --output out/test.out.css */\r\n\r\n:root {\r\n --testColor: blue;\r\n}\r\n\r\n.editor-styles-wrapper {\r\n background: grey;\r\n}\r\n\r\n.wp-block-group {\r\n background-image: url(\"data:image/svg+xml,%3Csvg%3E.b%7Bclip-path:url(test);%7D%3C/svg%3E\");\r\n color: red !important;\r\n}\r\n\r\nbody {\r\n color: var(--testColor);\r\n}\r\n\r\nbody:not(.some-class) {\r\n font-style: italic;\r\n}\r\n\r\n\r\nbody h1 {\r\n color: red;\r\n}\r\n\r\nbody p {\r\n color: yellow;\r\n}\r\n\r\nhtml h1 {\r\n text-decoration: underline;\r\n}\r\n"]}
/* (postcss-cli) postcss test.postcss.css --output out/test.out.css */
:root {
--testColor: blue;
}
.editor-styles-wrapper {
background: grey;
}
.wp-block-group {
background-image: url("data:image/svg+xml,%3Csvg%3E.b%7Bclip-path:url(test);%7D%3C/svg%3E");
color: red !important;
}
body {
color: var(--testColor);
}
body:not(.some-class) {
font-style: italic;
}
body h1 {
color: red;
}
body p {
color: yellow;
}
html h1 {
text-decoration: underline;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment