Skip to content
This repository was archived by the owner on Apr 6, 2021. It is now read-only.

Commit 9d80c6d

Browse files
committed
Add @screen support
1 parent e31cc73 commit 9d80c6d

File tree

3 files changed

+12
-0
lines changed

3 files changed

+12
-0
lines changed

src/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ const selectorParser = require('postcss-selector-parser')
1414
const resolveConfig = require('tailwindcss/resolveConfig')
1515
const escape = require('tailwindcss/lib/util/escapeClassName').default
1616
const evaluateTailwindFunctions = require('tailwindcss/lib/lib/evaluateTailwindFunctions').default
17+
const substituteScreenAtRules = require('tailwindcss/lib/lib/substituteScreenAtRules').default
1718
const parseObjectStyles = require('tailwindcss/lib/util/parseObjectStyles').default
1819
const transformThemeValue = require('tailwindcss/lib/util/transformThemeValue').default
1920
const prefixSelector = require('tailwindcss/lib/util/prefixSelector').default
@@ -1153,6 +1154,7 @@ module.exports = (pluginOptions = {}) => {
11531154
}
11541155
},
11551156
evaluateTailwindFunctions(context.tailwindConfig),
1157+
substituteScreenAtRules(context.tailwindConfig),
11561158
]).process(root, { from: undefined })
11571159
},
11581160
env.DEBUG &&

src/index.test.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,11 @@
44
'Segoe UI Symbol', 'Noto Color Emoji';
55
color: #3b82f6;
66
}
7+
@media (min-width: 1024px) {
8+
.screen-test {
9+
color: purple;
10+
}
11+
}
712
.apply-test {
813
margin-top: 1.5rem;
914
--tw-bg-opacity: 1;

src/index.test.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,11 @@ test('it works', () => {
5050
font-family: theme('fontFamily.sans');
5151
color: theme('colors.blue.500');
5252
}
53+
@screen lg {
54+
.screen-test {
55+
color: purple;
56+
}
57+
}
5358
.apply-test {
5459
@apply mt-6 bg-pink-500 hover:font-bold focus:hover:font-bold sm:bg-green-500 sm:focus:even:bg-pink-200;
5560
}

0 commit comments

Comments
 (0)