mirror of
https://github.com/primer/css.git
synced 2024-11-23 20:38:58 +03:00
initial commit
This commit is contained in:
commit
797aea1243
28
.eslintrc.json
Normal file
28
.eslintrc.json
Normal file
@ -0,0 +1,28 @@
|
||||
{
|
||||
"extends": "eslint:recommended",
|
||||
"env": {
|
||||
"node": true
|
||||
},
|
||||
"rules": {
|
||||
"comma-dangle": [2, "only-multiline"],
|
||||
"curly": 0,
|
||||
"radix": 2,
|
||||
"wrap-iife": 2,
|
||||
"brace-style": 0,
|
||||
"comma-style": 2,
|
||||
"consistent-this": 0,
|
||||
"indent": [2, 2, {
|
||||
"SwitchCase": 1
|
||||
}],
|
||||
"no-console": 0,
|
||||
"no-lonely-if": 2,
|
||||
"no-nested-ternary": 2,
|
||||
"no-use-before-define": [2, "nofunc"],
|
||||
"quotes": [2, "double"],
|
||||
"space-before-function-paren": [2, "never"],
|
||||
"keyword-spacing": 2,
|
||||
"space-before-blocks": [2, "always"],
|
||||
"space-in-parens": [2, "never"],
|
||||
"space-unary-ops": 2
|
||||
}
|
||||
}
|
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
npm-debug.log
|
3
.travis.yml
Normal file
3
.travis.yml
Normal file
@ -0,0 +1,3 @@
|
||||
language: node_js
|
||||
node_js:
|
||||
- '5'
|
6
CHANGELOG.md
Normal file
6
CHANGELOG.md
Normal file
@ -0,0 +1,6 @@
|
||||
|
||||
# HEAD
|
||||
|
||||
# 1.0.0
|
||||
|
||||
* Added: New rule `function-url-no-domain`
|
21
LICENSE
Normal file
21
LICENSE
Normal file
@ -0,0 +1,21 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2016 GitHub Inc.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
70
README.md
Normal file
70
README.md
Normal file
@ -0,0 +1,70 @@
|
||||
# selector-no-utility
|
||||
|
||||
[![NPM version](http://img.shields.io/npm/v/stylelint-selector-no-utility.svg)](https://www.npmjs.org/package/stylelint-function-url-no-domain)
|
||||
[![Build Status](https://travis-ci.org/primer/stylelint-selector-no-utility.svg?branch=master)](https://travis-ci.org/primer/stylelint-selector-no-utility)
|
||||
|
||||
**This plugin is extra specific to [primer-utilities](https://github.com/primer/utilities)** I will accept PRs to make it more generic, or feel free to fork and use it for your own classes.
|
||||
|
||||
You should not be able to style a utility classes. Utility classes are single purpose, reusing them to add extra style violates their single purpose.
|
||||
|
||||
```css
|
||||
.m-0, #bar .float-left, #hoo { border: 1px solid pink; }
|
||||
/** ↑ ↑
|
||||
* Each of these selectors */
|
||||
```
|
||||
|
||||
The following patterns are considered warnings:
|
||||
|
||||
```css
|
||||
#bar .float-left { border: 1px solid pink; }
|
||||
```
|
||||
|
||||
```scss
|
||||
#bar {
|
||||
.float-left { border: 1px solid pink; }
|
||||
}
|
||||
```
|
||||
|
||||
The following patterns are *not* considered warnings:
|
||||
|
||||
```css
|
||||
#bar { color: pink; }
|
||||
```
|
||||
|
||||
## Install
|
||||
|
||||
This repository is distributed with [npm][npm]. After [installing npm][install-npm], you can install `stylelint-function-url-no-domain` with this command.
|
||||
|
||||
```
|
||||
$ npm install --save-dev stylelint-function-url-no-domain
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
In your [stylelint config](http://stylelint.io/user-guide/configuration/) add this.
|
||||
|
||||
```json
|
||||
{
|
||||
"plugins": [
|
||||
"stylelint-selector-no-utility"
|
||||
],
|
||||
"rules": {
|
||||
"primer/selector-no-utility": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Related
|
||||
|
||||
* [Stylelint](http://stylelint.io/)
|
||||
* [primer-css][primer]
|
||||
|
||||
## License
|
||||
|
||||
MIT © [GitHub](https://github.com/)
|
||||
|
||||
[primer]: https://github.com/primer/primer
|
||||
[docs]: http://primercss.io/
|
||||
[npm]: https://www.npmjs.com/
|
||||
[install-npm]: https://docs.npmjs.com/getting-started/installing-node
|
||||
[sass]: http://sass-lang.com/
|
59
index.js
Normal file
59
index.js
Normal file
@ -0,0 +1,59 @@
|
||||
var stylelint = require("stylelint")
|
||||
var sass = require("node-sass")
|
||||
var postcss = require("postcss")
|
||||
|
||||
var ruleName = "primer/selector-no-utility"
|
||||
var messages = stylelint.utils.ruleMessages(ruleName, {
|
||||
rejected: "Avoid styling the utilty class",
|
||||
})
|
||||
|
||||
function buildUtilityClasses(options) {
|
||||
var utilityClasses = []
|
||||
|
||||
if (options == null) {
|
||||
options = {}
|
||||
}
|
||||
|
||||
var sassresult = sass.renderSync({
|
||||
data: options["data"] || "@import \"primer-utilities/index.scss\";",
|
||||
includePaths: [ "node_modules/" ].concat(options["include-paths"])
|
||||
})
|
||||
|
||||
// post css walking
|
||||
var utilRoot = postcss.parse(sassresult.css.toString())
|
||||
utilRoot.walkRules(function(rule) {
|
||||
utilityClasses = utilityClasses.concat(rule.selectors)
|
||||
})
|
||||
|
||||
return utilityClasses
|
||||
}
|
||||
|
||||
module.exports = stylelint.createPlugin(ruleName, function(enabled, options) {
|
||||
return function(root, result) {
|
||||
|
||||
var utilityClasses = buildUtilityClasses(options)
|
||||
|
||||
if (utilityClasses.length == 0) {
|
||||
return
|
||||
}
|
||||
|
||||
root.walkRules(function(rule) {
|
||||
|
||||
var ruleClasses = rule.selector.split(" ")
|
||||
|
||||
for (var i = 0; i < ruleClasses.length; i++) {
|
||||
if (utilityClasses.indexOf(ruleClasses[i]) >= 0) {
|
||||
stylelint.utils.report({
|
||||
message: messages.rejected,
|
||||
node: rule,
|
||||
result: result,
|
||||
ruleName: ruleName
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
module.exports.ruleName = ruleName
|
||||
module.exports.messages = messages
|
40
package.json
Normal file
40
package.json
Normal file
@ -0,0 +1,40 @@
|
||||
{
|
||||
"name": "stylelint-selector-no-utility",
|
||||
"version": "1.0.0",
|
||||
"description": "Stylelint rule that doesn't allow utility classes to be styled",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"lint": "eslint .",
|
||||
"test": "npm run lint && node test"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/primer/stylelint-selector-no-utility.git"
|
||||
},
|
||||
"keywords": [
|
||||
"stylelint-rule",
|
||||
"stylelint",
|
||||
"url",
|
||||
"domain",
|
||||
"primer",
|
||||
"github",
|
||||
"css"
|
||||
],
|
||||
"author": "GitHub, Inc.",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/primer/stylelint-selector-no-utility/issues"
|
||||
},
|
||||
"homepage": "https://github.com/primer/stylelint-selector-no-utility#readme",
|
||||
"dependencies": {
|
||||
"node-sass": "^3.7.0",
|
||||
"postcss": "^5.0.21",
|
||||
"postcss-value-parser": "^3.3.0",
|
||||
"primer-utilities": "^0.2.1",
|
||||
"stylelint": "^6.5.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"eslint": "^2.10.2",
|
||||
"stylelint-test-rule-tape": "^0.2.0"
|
||||
}
|
||||
}
|
14
test/index.js
Normal file
14
test/index.js
Normal file
@ -0,0 +1,14 @@
|
||||
var testRule = require("stylelint-test-rule-tape")
|
||||
var rule = require("..")
|
||||
|
||||
testRule(rule.rule, {
|
||||
ruleName: rule.ruleName,
|
||||
config: true,
|
||||
skipBasicChecks: true,
|
||||
accept: [
|
||||
{ code: "a { }" },
|
||||
],
|
||||
reject: [
|
||||
{ code: ".m-0 { color: #fff; }" }
|
||||
]
|
||||
})
|
Loading…
Reference in New Issue
Block a user