Skip to content

Commit b039fa5

Browse files
committedJan 2, 2021
test: test postcss application on linked css
1 parent dfef3de commit b039fa5

File tree

3 files changed

+36
-30
lines changed

3 files changed

+36
-30
lines changed
 

‎packages/playground/css/imported.css

+1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ pre {
1111
border-radius: 10px;
1212
}
1313

14+
/* test postcss nesting */
1415
.postcss {
1516
.nesting {
1617
color: pink;

‎packages/playground/css/index.html

+30-28
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,34 @@
11
<link rel="stylesheet" href="./linked.css" />
22

3-
<h1>CSS</h1>
4-
5-
<p class="linked">&lt;link&gt;: This should be blue</p>
6-
<p class="linked-at-import">@import in &lt;link&gt;: This should be red</p>
7-
8-
<p class="imported">import from js: This should be green</p>
9-
<p class="imported-at-import">
10-
@import in import from js: This should be purple
11-
</p>
12-
<p>Imported css string:</p>
13-
<pre class="imported-css"></pre>
14-
15-
<p class="postcss">
16-
<span class="nesting">PostCSS nesting plugin: this should be pink</span>
17-
</p>
18-
19-
<p class="sass">sass: This should be orange</p>
20-
<p class="sass-at-import">@import from SASS: This should be olive</p>
21-
<p>Imported SASS string:</p>
22-
<pre class="imported-sass"></pre>
23-
24-
<p class="modules">CSS modules: this should be turquoise</p>
25-
<p>Imported CSS module:</p>
26-
<pre class="modules-code"></pre>
27-
28-
<p class="modules-sass">CSS modules w/ SASS: this should be orangered</p>
29-
<p>Imported SASS module:</p>
30-
<pre class="modules-sass-code"></pre>
3+
<div class="wrapper">
4+
<h1>CSS</h1>
5+
6+
<p class="linked">&lt;link&gt;: This should be blue</p>
7+
<p class="linked-at-import">@import in &lt;link&gt;: This should be red</p>
8+
9+
<p class="imported">import from js: This should be green</p>
10+
<p class="imported-at-import">
11+
@import in import from js: This should be purple
12+
</p>
13+
<p>Imported css string:</p>
14+
<pre class="imported-css"></pre>
15+
16+
<p class="postcss">
17+
<span class="nesting">PostCSS nesting plugin: this should be pink</span>
18+
</p>
19+
20+
<p class="sass">sass: This should be orange</p>
21+
<p class="sass-at-import">@import from SASS: This should be olive</p>
22+
<p>Imported SASS string:</p>
23+
<pre class="imported-sass"></pre>
24+
25+
<p class="modules">CSS modules: this should be turquoise</p>
26+
<p>Imported CSS module:</p>
27+
<pre class="modules-code"></pre>
28+
29+
<p class="modules-sass">CSS modules w/ SASS: this should be orangered</p>
30+
<p>Imported SASS module:</p>
31+
<pre class="modules-sass-code"></pre>
32+
</div>
3133

3234
<script type="module" src="./main.js"></script>

‎packages/playground/css/linked.css

+5-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
@import './linked-at-import.css';
22

3-
.linked {
4-
color: blue;
3+
/* test postcss nesting */
4+
.wrapper {
5+
.linked {
6+
color: blue;
7+
}
58
}

0 commit comments

Comments
 (0)
Please sign in to comment.